<script type="text/javascript"> $(function () { $("#linkType").change(function () { var typevalue = $("#linkType").val(); alert(typevalue); $.ajax({ type: "GET", url: "/Admin/LinkManage/Index", data: { linktype: typevalue } }); }); }); </script>
有一点需要注意的是$.ajax中URL参数最好是全路径的要不然VS会提示你找不到相应的视图。如果没有/Admin 它会去~/View/LinkManage里面找你的LinkList.cshtml。
当传入linktype值后后台的Controller会做相应的处理得到不同的数据集合,然后判断是不是Ajax的请求,如果是则执行LinkList分布视图数据绑定的操作,但是这样在页面上并没有显示对应的数据,因为你没有将这些数据显示在页面上,所以还需要在$.ajax执行完成之后将dvLink的html替换。
完整的Javascript代码如下:
<script type="text/javascript"> $(function () { $("#linkType").change(function () { var typevalue = $("#linkType").val(); alert(typevalue); $.ajax({ type: "GET", url: "/Admin/LinkManage/Index", data: { linktype: typevalue }, dataType:"html",//格式是html success: function (evt) { $('#dvLink').html(evt);//替换成新的数据 } }); }); }); </script>
这样一个根据DropDownList值改变更新数据列表功能就完成了,像编辑、删除这样的操作也可以这样实现。