将模型属性的值作为ajax参数发送

本文关键字：ajax 参数 模型 属性 | 更新日期: 2023-09-27 18:24:06

我的视图页面中有以下表单

@using (Html.BeginForm())
{
   @Html.EditorFor(model => model.Product_ID)
   <input id="idd" type="file" class="file">
   // form sumbit button
   <input type = "submit" value="Create" /> 
}

我想在点击该表单的提交按钮之前，将上面插入的Product_ID作为ajax对象路由值发送。因为我像创建product_ID = Model.Product_ID一样创建了它，但product_ID变为空。

$('#idd').click(function () {
    $.ajax({
        url: '@Url.Action("CreateDirectory", "Home",new { product_ID = Model.Product_ID })',
        type: "POST",

控制器

    [HttpPost]
    public JsonResult CreateDirectory(string product_ID)
    {
      ...........
    }

编辑

使用上面脚本中的警报，我试图显示Product_ID

alert('@Model.Product_ID');

没有显示值的相同结果

将模型属性的值作为ajax参数发送

@Url.Action()是剃刀代码，在发送到视图之前在服务器上进行评估，因此如果Model.Product_ID的初始值是null，则您的代码将仅呈现url: '/Home/CreateDirectory'。生成文本框后更改文本框中的值不会更新url的值。

相反，使用ajax data选项来传递文本框的值

$('#idd').click(function () {
    $.ajax({
        url: '@Url.Action("CreateDirectory", "Home")', // modify
        data: { product_ID: $('#Product_ID').val() }, // add this
        type: "POST",

这是因为您的操作只接受[HttpPost]数据并且您正在查询字符串[HttpGet]中发送变量

@Url.Action("CreateDirectory", "Home",new { product_ID = Model.Product_ID })

url是下一个：

~/Home/CreateDirectory?product_ID = ....

将[HttpPost]属性替换为[HttpGet]，或者仅将其删除

并设置ajax｛type:"GET"｝

或者：

$.ajax({
        url: '@Url.Action("CreateDirectory", "Home")',
        type: "POST",
        data: { product_ID: '@(Model.Product_ID)' }

或者：

$.ajax({
        url: '@Url.Action("CreateDirectory", "Home")',
        type: "POST",
        data: { product_ID: $('#Product_ID').val() }

在这一行中，您将在页面中呈现模型的初始值赋予product_ID，因此它可能为空

url: '@Url.Action("CreateDirectory", "Home",new { product_ID = Model.Product_ID })'

试试这个

url: '@Url.Action("CreateDirectory", "Home")' + '?product_ID=' + $("Product_ID").val()

编辑也许你也需要这个

 [HttpPost]
public JsonResult CreateDirectory([FromUri]string product_ID)
{
  ...........
}

您的代码应该可以正常工作。

@model ProductInfoVM
@using (Html.BeginForm())
{
    @Html.EditorFor(model => model.Product_ID)
}
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<input id="idd" type="file" class="file">
<script type="text/javascript">
    $(function() {
        $('#idd').click(function() {
            $.ajax({
                url: '@Url.Action("Index", "Home", new {productID = @Model.Product_ID})',
                type: "POST"
            });
        });
    })
</script>

假设您有一个接受productID 的HttpPost操作方法

[HttpPost]
public ActionResult Index(string productId)
{
   // to do : do something
}

我唯一能想到的NULL出现的原因是，你的模型。当您呈现页面时，Product_ID本身为NULL。因此，我将研究您的GET操作方法，看看您是否正确地设置了视图模型的Product_ID属性值。

相关文章：