Jquery一个ajax与html.dropdown

时间:2011-12-12 12:16:23

标签: asp.net asp.net-mvc jquery

情况是:当我从html.dropdown中选择一个值时,我需要以相同的方式以相同的方式存储在数据库中另一个表中的相应值(保持下拉可见)。
我的考虑::首先我需要将选定的下拉值传递给某些控制器操作(使用jquery处理程序)。那个控制器动作必须返回一个局部视图,我可以在Ajax的帮助下在dropdownlist视图中显示........需要一些代码

1 个答案:

答案 0 :(得分:1)

您可以使用javascript订阅下拉列表的.change事件,并触发向服务器发送所选值的AJAX请求。例如,假设您有以下下拉列表(具有唯一ID,以便可以从您的javascript文件中更容易地引用它,并且HTML5 data- *属性指向将在值更改时调用的服务器控制器操作):

@Html.DropDownListFor(
    x => x.SomeProperty, 
    Model.Items, 
    new { 
        data_url = Url.Action("Foo", "SomeController"),
        id = "myddl" 
    }
)

在单独的javascript文件中,您可以订阅更改事件:

$(function() {
    // When the DOM is loaded subscribe to the .change event of the dropdown list
    // with id="myddl"
    $('#myddl').click(function() {
        // when the value of the dropdown changes fetch the new value
        var selectedValue = $(this).val();

        // fetch the url
        var url = $(this).data('url');

        // send the selected value to the server using a AJAX POST request
        $.post(url, { value: selectedValue }, function(result) {
           // will be called when the AJAX succeeds. Here you could process
           // any eventual results sent by the server. For example the server could
           // return some JSON object indicating whether the operation succeeded or not
        });
    });
});

将调用相应的操作:

[HttpPost]
public ActionResult Foo(string value)
{
    // at this stage value will equal the selected dropdown value
    // so that you can update your database and do whatever you want with it
    ...
}