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

Question

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

@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)
    {
      ...........
    }

编辑

在上面的脚本中使用 alert 我尝试显示 Product_ID

alert('@Model.Product_ID');

相同的结果没有显示价值

Answer 1

@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",

Answer 2

因为您的操作只接受 [HttpPost] 数据 并且您正在查询字符串 [HttpGet]

中发送变量

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

网址是下一个：

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

用 [HttpGet] 替换 [HttpPost] 属性，或者直接删除它

并设置 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() }

Answer 3

在这一行中，您为 product_ID 提供了模型在页面中呈现的初始值，因此它可能为 null

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)
{
  ...........
}

Answer 4

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

@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 出现的原因是，当您呈现页面时，您的 Model.Product_ID 本身就是 NULL。因此，我会查看您的 GET 操作方法，看看您是否正确设置了视图模型的 Product_ID 属性值。