Question

我有一个2下拉列表，我必须根据我从第一个下拉列表中获得的ID绑定第二个。在第一个下拉列表中，我添加了OnChange个事件。

function onChange() {
    var variantDropDown = $('#VariantName');
    $.ajax({
            url: '/Admin/CustomProductPinCodesManagement/GetProductVarinats',
            type: 'post',
            data: { productId: $("#ProductName").data("tDropDownList").value() },
                      success: function (data) {
                          $.each(variants, function (i, variant) {
                              $states.append('<option value="' + variant.Id + '">' +   variant.Name + '</option>');
            });
        },
        error: function () {
            alert('Error');
        }
    });
}

这是c＃代码。

[HttpPost]
public ActionResult GetProductVarinats(string productId)
{
    var variants = _productService.GetProductVariantsByProductId(Convert.ToInt32(productId));
    return Json(new { Result = true, data = variants }, JsonRequestBehavior.AllowGet);
}

但它不起作用。

Answer 1

AcidMedia有一个名为TTControls的库，它使用Telerik，你可以使用TTControls.LinkedDropDown控件来解决这个问题。

Answer 2

使用val()代替value()

更改声明

data: { productId: $("#ProductName").data("tDropDownList").value() }

到

data: { productId: $("#ProductName").data("tDropDownList").val() }

并且成功应该像

success: function (data) {
  //For getting list of variants, you should access it by `data.data.variants`
  //because you will get your json object in data, and for getting the value `variants`
  //you should capture the `data` property of returned json object like `data.data`

  $.each(data.data.variants, function (i, variant) {

     $states.append('<option value="' + variant.Id + '">'+ variant.Name + '</option>');

     //you can try this also for creating options
     //$states.append($('<option/>').text(variant.Name).attr('value',variant.Id));
  });
}

所以你的功能应该是这样的：

function onChange() {
   var variantDropDown = $('#VariantName');
   $.ajax({
      url: '/Admin/CustomProductPinCodesManagement/GetProductVarinats',
      type : 'post',
      data: { productId: $("#ProductName").data("tDropDownList").val() },
      success: function (data) {
        $.each(data.data.variants, function (i, variant) {
           $states.append($('<option/>').text(variant.Name).attr('value',variant.Id));
         });
      },
      error: function () {
         alert('Error');
      }
    });
 }

jquery ajax绑定dropdownlist MVC

2 个答案: