Question

我有一个下拉列表，当它发生变化时。我希望使用ajax

将所选值输入控制器

      $(document).ready(function () {
        $("#otherCatches").change(function () {

            $.ajax({
                url: "Clients/DDL",
                type: "POST",
                data: {
                    name: $('#othercatches').val()
                },
                success: function (result) {
                    alert(result)
                }
            });
            return false;
        });
    });

         <select id ="otherCatches">
          @foreach (var item in Model.Sample)
         {
           <option>
                @item.SampleName
           </option> 
         }
        </select>

没有击中控制器

[HttpPost]
public virtual ActionResult DDL(int name)
{

     //do method here

}

Answer 1

在您的查看代码中，您未设置value的{{1}}属性。因此option会为您提供 undefined 。

使用DropDownList / DropDownListFor HTML帮助程序方法呈现SELECT元素。

使用强类型视图。例如：如果您的视图是用于创建DDL，您将定义一个像这样的视图模型

$('#othercatches').val()

现在，在我们的public class ClientDDL { public string Name { set;get;} public int SelectedCatch { set;get;} public IEnumerable<SelectListItem> OtherCatches { set;get;} //Other relevant proeprties also here public ClientDDL() { //Lets initialize the OtherCatches Proeprty OtherCatches=new List<SelectListItem>(); } }操作中，我们将创建此ViewModel的对象并将其发送到视图。

GET

现在我们的视图（public ActionResult CreateDDL() { ClientDDL ddl new ClientDDL(); // The below line is hard coded for demo. you may replace // this with loading data from your Data access layer. ddl.OtherCatches= new[] { new SelectListItem { Value = "1", Text = "Book" }, new SelectListItem { Value = "2", Text = "Pen" }, new SelectListItem { Value = "3", Text = "Computer" } }; return View(ddl); }），我们CreateDDL.cshtml类的强类型将会是这样的

ClientDDL

永远不要将路径硬编码到这样的动作方法。尽可能使用URL Helper方法。

不确定为什么你有@model ClientDDL @using(Html.Beginform()) { @Html.DropDownListFor(x => x.SelectedCatch, new SelectList(Model.OtherCatches,"Value","Text"), "Select..") } <script type="text/javascript"> $(function(){ $("#SelectedCatch").change(function(){ $.ajax({ url: "@Url.Action("DDL","Clients")", type: "POST", data: { name: $(this).val() }, success: function (result) { alert(result) } }); }); }); </script>方法？这应该很简单

virtual

下拉列表，ajax不会转到控制器

1 个答案: