文章/答案/技术大牛

发布

社区首页 >问答首页 >Ajax.BeginForm(.)不总是工作，有时完全回发，使用ASP.NET MVC

问Ajax.BeginForm(.)不总是工作，有时完全回发，使用ASP.NET MVC
EN

Stack Overflow用户

提问于 2011-03-31 00:09:51

回答 3查看 4.6K关注 0票数 1

我无法理解为什么这个回发有时会像它应该做的那样做ajax，而有时却不会。以下是相关代码：

联署材料：

<html>
<head>
<title>Index</title>
<link href="/Content/screen.css" rel="stylesheet" type="text/css" />
<!--[if lt IE 8]><link href="/Content/ie.css" rel="stylesheet" type="text/css" /><![endif]-->
<link href="/Content/plugins/fancy-type/screen.css" rel="stylesheet" type="text/css" />
<link href="/Content/plugins/buttons/screen.css" rel="stylesheet" type="text/css" />
<link href="/Content/plugins/link-icons/screen.css" rel="stylesheet" type="text/css" media="screen, projection" />
<link href="/Content/jQueryUI/css/cupertino/jquery-ui-1.8.9.custom.css" rel="stylesheet" type="text/css" />
<link href="/Content/HelpDesk.css" rel="stylesheet" type="text/css" />
<link href="/Content/droppy.css" rel="stylesheet" type="text/css" />
<link href="/Content/tablesorter.css" rel="stylesheet" type="text/css" />
<script src="/Scripts/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery-ui.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
<script src="/Scripts/jquery.droppy.js" type="text/javascript"></script>
<script src="/Scripts/jquery.cascadingDropDown.js" type="text/javascript"></script>
<script src="/Scripts/jquery.tablesorter.min.js" type="text/javascript"></script>
<script type='text/javascript'>
    $(function () {
        $('#nav').droppy();
    });
</script>
<script type="text/javascript">
        $(document).ready(function () {
            $("#targetStartDate").datepicker();
            $("#targetEndDate").datepicker();
            $("#ticketsHTMLTable").tablesorter({ sortList: [[0, 0], [1, 0]] });
            $(".fakeLink").mouseover(function () {
                $(this).css("color", "red");
            });
            $(".fakeLink").mouseout(function () {
                $(this).css("color", "black");
            });
        });
</script>
</head>

这是我的观点(Razor)：

@using (Ajax.BeginForm("Index", "Problem", new AjaxOptions
{
    HttpMethod = "GET",
    UpdateTargetId = "ticketsTable",
    InsertionMode = InsertionMode.Replace

}))
{
       <div class="notice">
        <div class="prepend-1 span-2">
            <label for="targetPriorityID">
                Priority</label>
        </div>
        <div class="prepend-1 span-3">
            <label for="targetStatusID">
                Status</label>
        </div>
        <div class="span-3">
            <label for="targetBusinessUnitID">
                Business Unit</label>
        </div>
        <div class="span-3 prepend-1">
            <label for="targetStartDate">
                Start Date</label></div>
        <div class="span-3 prepend-2">
            <label for="targetEndDate">
                End Date</label></div>
        <div class="prepend-1 span-3 last">
            &nbsp
        </div>        <div class="prepend-1 span-2">
            @Html.DropDownList("targetPriorityID",
new SelectList(ViewBag.Priorities as System.Collections.IEnumerable,
"ID", "Title"), "All", new { @onchange = " this.form.submit();" })
        </div>
        <div class="prepend-1 span-3">
            @Html.DropDownList("targetStatusID",
new SelectList(ViewBag.Statuses as System.Collections.IEnumerable,
       "ID", "Title"),"All", new { @onchange="this.form.submit();" })
        </div>
        <div class="span-3">
            @Html.DropDownList("targetBusinessUnitID",
new SelectList(ViewBag.BusinessUnits as System.Collections.IEnumerable,
       "ID", "Title"), "All", new { @onchange = "this.form.submit();" })
        </div>

        <div class="span-3 prepend-1">@Html.TextBox("targetStartDate", "", new { onchange = "this.form.submit();" })</div>
        <div class="span-3 prepend-2">@Html.TextBox("targetEndDate", "", new { onchange = "this.form.submit();" })</div>
        <div class="prepend-1 span-3 last">
            <input type="submit" value="Hide" />
        </div>
        <br />
        <br />
        <br />
    </div>
}
<div id="ticketsTable">
    @Html.Partial("_AllTickets", Model)
</div>

最后是控制器，

    [HttpPost]
    public ActionResult Index(int targetPriorityID = -1, int targetBusinessUnitID = -1, int targetStatusID = -1, string targetStartDate = "", string targetEndDate ="")
    {
        Repository<Priority> priorityRepository = new Repository<Priority>();
        Repository<BusinessUnit> businessUnitRepository = new Repository<BusinessUnit>();
        Repository<Status> statusRepository = new Repository<Status>();

        ViewBag.Priorities = priorityRepository.GetAll();
        ViewBag.BusinessUnits = businessUnitRepository.GetAll();
        ViewBag.Statuses = statusRepository.GetAll();

        var results = problemRepository.GetAll();

        results = (targetPriorityID != -1) ? results.Where(t => t.PriorityID == targetPriorityID) : results;
        results = (targetBusinessUnitID != -1) ? results.Where(t => t.BusinessUnitID == targetBusinessUnitID) : results;
        results = (targetStatusID != -1) ? results.Where(t => t.StatusID == targetStatusID) : results;
        results = (targetStartDate != "") ? results.Where(t => t.DateReported >= DateTime.Parse(targetStartDate)) : results;
        results = (targetEndDate != "") ? results.Where(t => t.DateReported <= DateTime.Parse(targetEndDate)) : results;


        if (Request.IsAjaxRequest())
        {
            return PartialView("__AllTickets", results);
        }

        return View(results);

    }

有什么想法吗？

asp.net-mvc

asp.net-mvc-3

jquery

asp.net-ajax

回答 3

Stack Overflow用户

回答已采纳

发布于 2011-04-11 02:20:18

我看到的一个问题是，Razor视图中的AJAX选项指定GET HTTP方法，但是控制器操作上的操作过滤器指定POST。

票数 0

Stack Overflow用户

发布于 2011-03-31 06:18:34

我建议您以后使用将是AJAXified的普通形式：

@using (Html.BeginForm("Index", "Problem")
{
    <div class="notice">
        <div class="prepend-1 span-2">
            <label for="targetPriorityID">Priority</label>
        </div>
        <div class="prepend-1 span-3">
            <label for="targetStatusID">Status</label>
        </div>
        <div class="span-3">
            <label for="targetBusinessUnitID">Business Unit</label>
        </div>
        <div class="span-3 prepend-1">
            <label for="targetStartDate">Start Date</label></div>
        <div class="span-3 prepend-2">
            <label for="targetEndDate">End Date</label>
        </div>
        <div class="prepend-1 span-3 last">
            &nbsp
        </div>        
        <div class="prepend-1 span-2">
            @Html.DropDownList("targetPriorityID", new SelectList(ViewBag.Priorities as System.Collections.IEnumerable, "ID", "Title"), "All")
        </div>
        <div class="prepend-1 span-3">
            @Html.DropDownList("targetStatusID", new SelectList(ViewBag.Statuses as System.Collections.IEnumerable, "ID", "Title"), "All")
        </div>
        <div class="span-3">
            @Html.DropDownList("targetBusinessUnitID", new SelectList(ViewBag.BusinessUnits as System.Collections.IEnumerable, "ID", "Title"), "All")
        </div>

        <div class="span-3 prepend-1">
            @Html.TextBox("targetStartDate", "")
        </div>
        <div class="span-3 prepend-2">
            @Html.TextBox("targetEndDate", "")
        </div>
        <div class="prepend-1 span-3 last">
            <input type="submit" value="Hide" />
        </div>
        <br />
        <br />
        <br />
    </div>
}

<div id="ticketsTable">
    @Html.Partial("_AllTickets", Model)
</div>

然后在一个单独的文件AJAXify中：

$(function() {
    $('form :input').change(function() {
        var form = $('form');
        $.ajax({
            url: form.attr('action'),
            type: form.attr('method'),
            data: form.serialize(),
            success: function(result) {
                $('#ticketsTable').html(result);
            }
        });
    });
});

我建议您的另一个改进是使用视图模型，摆脱ViewData，使用强类型的帮助。

票数 1

Stack Overflow用户

发布于 2011-04-04 16:53:56

我想知道Request.IsAjaxRequest()是否导致了这个问题。我将考虑删除该代码，并始终返回PartialView("__AllTickets", results);。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/5493928

复制

相似问题

问Ajax.BeginForm(.)不总是工作，有时完全回发，使用ASP.NET MVC
EN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Ajax.BeginForm(.)不总是工作，有时完全回发，使用ASP.NET MVCEN

回答 3

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Ajax.BeginForm(.)不总是工作，有时完全回发，使用ASP.NET MVC
EN