Question

当我选择下拉列表时，选择下拉值不会出现在控制器操作方法中。选定的值在ajax中绑定但在控制器操作方法中不绑定 see our page

<div class="row">
  <div class="col-lg-3">
    <fieldset class="form-group">
      <label class="form-label semibold control-label">Generic</label> 
      @Html.DropDownList("MasterGenericID", null, "--- Select Generic ---", new { @class = "select2-arrow" })
    </fieldset>
  </div>

$('#btnsearch').click(function() {
  var genericID = $('#MasterGenericID').val();
  $.ajax({
    type: 'POST',
    url: "@Url.Action("ProductMasterController", "ProductMasterview")",
    data: JSON.stringify(GenericID),
    contentType: "application/json",
    dataType: 'json',
    success: function(data) {
      // if (response.id > 0)
      alert("test" + data.GenericID);
    },
    async: true // make it true if you want to make an async call.
  });
});

public ActionResult ProductMasterview(string GenericID)
  if (Convert.ToInt32(GenericID) > 0) 
  {
    return View(dPMSP.GetAllProductsUsingGenericID(GenericID));
  } 
  else 
  {
    Generic_Bind();
    Therapeutic_Bind();
    SubTherapeutic_Bind();
    Formulation_Bind();
    return View(dPMSP.GetAllProducts());
  }
}

Error page

谢谢

Answer 1

您正在将值直接传递给ajax调用，而应传递具有GenericID属性的对象

实施例 -

    $('#btnsearch').click(function () {
    var value = $('#MasterGenericID').val();

    var data = {
        GenericID: value
    };

    $.ajax({
        type: 'POST',
        url: "@Url.Action("ProductMasterview", "ProductMaster")",
        data: JSON.stringify(data),
        contentType: "application/json",
        dataType: 'json',
        success: function(data) {
            // if (response.id > 0)
            alert("test" + data.GenericID);
        },
        async: true // make it true if you want to make an async call.
    });
});

Answer 2

js应该像

$('#btnsearch').click(function() {
  var genericID = $('#MasterGenericID').val();
  var postData={
               GenericID:genericID
               };
  $.ajax({
    type: 'POST',
    url: '@Url.Action("ProductMasterController", "ProductMasterview")',
    data: postData,
    dataType: 'json',
    success: function(data) {
      // if (response.id > 0)
      alert("test" + data.GenericID);
    },
 error: function(xhr, ajaxOptions, thrownError) {
                                    alert('Failed to delete');
                                }
  });
});

C＃代码应该看起来像

[HttpPost]
public ActionResult ProductMasterview(string GenericID)
{
  if (Convert.ToInt32(GenericID) > 0) 
  {

    //return View(dPMSP.GetAllProductsUsingGenericID(GenericID));
    //you can return only the genericId as you expect it at ajax success
    return Json(new { GenericID = yourGenericId});
  } 
  else 
  {
    Generic_Bind();
    Therapeutic_Bind();
    SubTherapeutic_Bind();
    Formulation_Bind();
    //return View(dPMSP.GetAllProducts());
    //you can return only the genericId as you expect it at ajax success

    return Json(new { GenericID = yourGenericId});
  }
}

Answer 3

您的代码存在许多问题。

看看这一行

data: JSON.stringify(GenericID),

您使用的是变量GenericID，但未在任何地方定义。请记住 javascript区分大小写。因此，请确保使用正确的案例。

现在看看这一行

url: '@Url.Action("ProductMasterController", "ProductMasterview")',

您错误地使用了Url.Action帮助程序方法。如果您使用带有2个参数的重载，则第一个参数应为操作名称，第二个参数应为控制器名称。此外，您不需要Controller后缀。所以它应该像

url: "@Url.Action("ProductMasterview", "ProductMaster")",

我注意到的另一个问题是，您将ajax调用的dataType属性指定为json。 $.ajax方法使用此属性值来解析来自服务器的数据。在这里，您告诉$.ajax您希望来自服务器的JSON响应。但是你的action方法是返回一个视图结果，它是HTML /纯文本，而不是JSON。因此，您的代码将无法按预期工作。

我也看到你正在进行POST调用，但你的action方法没有用HttpPost属性修饰。所以你的ajax调用不会触及action方法。此外，您的问题还不清楚您要返回的数据类型。（JSON /查看结果-HTML）。

如果要返回视图结果（html标记），则应返回部分视图结果，以便可以使用它来更新DOM的某些部分。如果你要返回整个视图，那么进行ajax调用是没有意义的（当我在你的动作方法代码的else部分看到4个方法调用时，我感觉你正试图这样做）

也使用正确的数据类型。如果要传递数值，请使用数字类型（int或long），而不是使用string作为参数，稍后再进行转换。请记住，当您传递给它的值无法安全地转换为int（例如：Convert.ToInt32）时，12abc会抛出异常。

使用int作为参数类型。

public ActionResult ProductMasterview(int genericId)
{
    // some other logic you want to do .
    return PartialView(dPMSP.GetAllProductsUsingGenericID(genericId));
}

您应该更新GetAllProductsUsingGenericID方法以使用int类型，而不是字符串。

现在在客户端，您可以在data属性中传递选定的选项值。由于您的操作方法未使用HttpPost属性进行修饰，因此只需使用GET（$.ajax的默认类型）。还可以使用与操作方法参数名匹配的键在js对象中发送所选选项值。

$('#btnsearch').click(function() {
    var id = $('#MasterGenericID').val();
    $.ajax({
        url: "@Url.Action("ProductMasterview", "ProductMaster")",
        data: { genericId: id }  
    }).done(function(response) {
        console.log('Received response from server');
        console.log(response);
        // If you want to update the DOM with the response
        // Ex : $("#SomeDomElementId").html(response);
    }).fail(function(x, a, e) {
        alert(e);
    });
});

如果你想从你的动作方法中返回JSON，那很好。您不必指定dataType属性，因为jQuery将尝试根据响应头智能地猜测它。

查看控制器数据传递

3 个答案: