MVC下拉列表onchange事件未正确调用控制器中的操作

时间:2013-12-18 09:21:09

标签: javascript jquery ajax asp.net-mvc-4 onchange

我需要做的就是当选择更改下拉列表时,使用AJAX我想调用一个动作并传递一些数据。在下面,您可以找到我正在使用的代码。我经常搜索,不知道为什么它没有进入行动。数据和网址是正确的。 Controller名称是HomeController,操作名称是getData。

<script type="text/javascript">
    function submitform() {
        var a = document.getElementById("tournaments");
        var datad = a.options[a.selectedIndex].value;
        var url = '/Home/getData';
        var completeurl = window.location.host + url;

        alert(completeurl);
        $.ajax({
            type: "GET",
            url: completeurl,
            data: {tournamentid : datad},
            datatype: 'JSON',
            success: function (data) { alert('got here with data'); },
            error: function () { alert('something bad happened'); }
        });
        };

</script>

Dropdownlist:
 <%: @Html.DropDownList("tournaments", null, new { name = "tournaments", title = "Please Select Tournament.", onchange = "submitform();",id = "tournaments"}) %>

Action:
[HttpGet]
    public ActionResult getData(int? tournamentid)
    {
        //perform your action here
        UserBl us = new UserBl();
        int num = Convert.ToInt32(tournamentid);
        Tournament tour = us.GetTournamentById(num);
        return Json(tour, JsonRequestBehavior.AllowGet);
    } 

2 个答案:

答案 0 :(得分:0)

你会这样做:

$(function(){   // document and jquery ready
       $("#tournaments").on("change", function(e){
              var dropValue = $(this).val();

               $.ajax({
        type: "GET",
        url: '/Home/getData/' + dropValue,
        datatype: 'JSON',
        success: function (data) { alert('got here with data'); },
        error: function () { alert('something bad happened'); }
    });
        });
 });

答案 1 :(得分:0)

有两种方法 一个是(使用selectedItem作为tournamentId)

<script type="text/javascript">
$(function () {
    $("#tournaments").change(function () {
        var selectedItem = $(this).val();
        submitform(selectedItem);
    });
});</script>

或者 将 javascript:放入onchange属性

onchange = "javascript:submitform();"

已编辑: 因为我会建议

$.ajax({
cache: false,
type: "GET",
url: url,
data: { "tournamentid ": datad},
success: function (data) {
    alert("succeded")
},
error: function (xhr, ajaxOptions, thrownError) {
    alert('Failed ');
}});