asp.net-mvc - MVC : pass parameter to action using Jquery. ajax()

Question

我对 MVC 还很陌生。我需要使用 html.Action() 对带有参数的 Action 进行 ajax 调用。我无法通过这个..

希望它对其他 MVC 初学者也有帮助..

HTML:

<%: Html.ActionLink("Add Race", "AddRace", 
        new {eventId = Model.EventId, fleetId=Model.SelectedFleet.ID}, 
        new{@onclick=string.Format("return checkFleetAddedandScroing()")}) %>

Jquery:

 function checkFleetAddedandScroing() {
        debugger;
        $.ajax({
            type: "GET",
            url: '<%=Url.Action("CheckFleetExists")%>',
            dataType: "json",
            cache: false,
            success: function (data, textStatus) {
                data = eval("(" + data + ")");
                if (data == true) {
                    return true;
                }
                else {
                    alert("Cannot Add race becasue you have not yet added any fleets and fleet scoring is checked.");
                    return false;
                }
            }, //success
            error: function (req) {

            }
        });           
    }

行动:

  public JsonResult CheckFleetExists(Guid fleetId )
    {
        bool exists = false;
        try
        {
            exists = !db.Races.Any(r => r.FleetID == fleetId);
        }
        catch
        {
        }
        return Json(exists, JsonRequestBehavior.AllowGet);
    }

我需要将 fleetid 传递给 Model.SelectedFleet.ID 中的操作。它在页面的某个地方被使用。但我无法以某种方式使用它..

请指出我做错的地方......

Answer 1

看起来您正在尝试在单击链接时使用 AJAX 调用 Controller 操作，并且根据此调用的结果，要么允许用户重定向到实际的 AddRace 操作，要么提示错误消息。

您的代码的问题是您尝试从成功 AJAX 回调中返回 true/false，这没有任何意义。您需要始终从点击回调中返回 false，并在成功回调中，根据服务器返回的值，使用 window.location.href 函数手动重定向。

HTML:

<%: Html.ActionLink(
    "Add Race", 
    "AddRace", 
    new {
        eventId = Model.EventId, 
        fleetId = Model.SelectedFleet.ID
    }, 
    new {
        data_fleetid = Model.SelectedFleet.ID,
        @class = "addRace"
    }
) %>

Jquery:

<script type="text/javascript">
    $(function () {
        $('.addRace').click(function (evt) {
            $.ajax({
                type: 'GET',
                url: '<%= Url.Action("CheckFleetExists") %>',
                cache: false,
                data: { fleetId: $(this).data('fleetid') },
                success: function (data) {
                    if (data.exists) {
                        // the controller action returned true => we can redirect
                        // to the original url:
                        window.location.href = url;
                    }
                    else {
                        alert("Cannot Add race becasue you have not yet added any fleets and fleet scoring is checked.");
                    }
                },
                error: function (req) {

                }
            });

            // we make sure to cancel the default action of the link
            // because we will be sending an AJAX call
            return false;
        });
    });
</script>

行动:

public ActionResult CheckFleetExists(Guid fleetId)
{
    bool exists = false;
    try
    {
        exists = !db.Races.Any(r => r.FleetID == fleetId);
    }
    catch
    {
    }
    return Json(new { exists = exists }, JsonRequestBehavior.AllowGet);
}

备注:在您的 AddRace Controller 操作中，不要忘记执行与在 CheckFleetExists 中执行的相同验证。用户可以简单地禁用 JavaScript，AJAX 调用将永远不会完成。