c# - Ajax 不返回部分视图

Question

我真的有一组简单的代码来带回一组由下拉菜单触发的数据。

这是脚本：

function () {
   $('#ProviderID').change(function () {

    $.ajax({
        url: '/servicesDisplay/Index',
        type: 'Get',
        data: { id: $(this).attr('value') },
        success: function (result) {
            // The AJAX request succeeded and the result variable
            // will contain the partial HTML returned by the action
            // we inject it into the div:
            $('#serLocations').html(result);
        }
    });
}); 

这是控制器：

 public ActionResult Index(string id)
 {
     int prid = Int32.Parse(id.Substring(0, (id.Length-1))); 
     string mulitval = id.Substring((id.Length-1), 1).ToString();
     System.Data.Objects.ObjectResult<getProviderServiceAddress_Result> proList = theEntities.getProviderServiceAddress(prid);
     List<getProviderServiceAddress_Result> objList = proList.ToList();
     SelectList providerList = new SelectList(objList, "AddressID","Address1");
     //ViewBag.providerList = providerList;
     return PartialView("servicesDisplay/Index", providerList);
 }

这是视图：

@model OCS_CS.Models.servicesDisplay

  <div>
    @Html.DropDownList(model => model.ServiceAdderssID, (IEnumerable<SelectListItem>)model)
 </div>   

当下拉列表传递值时。这些应用程序确实击中了控制器。但它以浅红色突出显示下拉菜单，并且视图永远不会显示。

Answer 1

You are doing a GET, thats no meaning to pass data to ajax, you may pass data for POST:

First, put the value at the URL:

function () {
 $('#ProviderID').change(function () {

 $.ajax({
    url: '/servicesDisplay/Index/' + $(this).attr('value'),
    type: 'Get',
    success: function (result) {
        // The AJAX request succeeded and the result variable
        // will contain the partial HTML returned by the action
        // we inject it into the div:
        $('#serLocations').html(result);
    }
  });
});

Second, mark the method as GET

 [HttpGet]
 public ActionResult Index(string id)

Hopes this help you!

Answer 2

试试这个使用 jqueryload方法的简短版本。

$(function(){

   $('#ProviderID').change(function () {
      $('#serLocations').load("@Url.Action("Index","ServicesDisplay")?id="
                                                              +$(this).val());   
    });

}); 

如果你想避免缓存结果，你可以发送一个唯一的时间戳以及查询字符串来避免缓存。

$('#serLocations').load("@Url.Action("Index","ServicesDisplay")?id="
                                                  +$(this).val()+"&t="+$.now()); 

Answer 3

你的代码有很多问题。首先为您的视图定义的模型是：

@model OCS_CS.Models.servicesDisplay

但在您的操作中，您通过传入 SelectList 来调用此视图：

SelectList providerList = new SelectList(objList, "AddressID","Address1");
return PartialView("servicesDisplay/Index", providerList);

这不会飞，因为模型不按类型匹配。秒问题是您正在将此 SelectList 转换为 IEnumerable。这也行不通。您需要转换为 SelectList：

@Html.DropDownList(model => model.ServiceAdderssID, (SelectList)model)

但是，除非您将操作中的模型类型与视图中的模型匹配，否则这些都不会起作用。我建议您安装 Fiddler 来帮助您确定您遇到的错误类型。