Asp.net mvc Ajax.BeginForm（…）不总是工作，有时使用ASP.NETMVC进行完全回发_Asp.net Mvc_Asp.net Mvc 3_Jquery_Asp.net Ajax

Asp.net mvc Ajax.BeginForm（…）不总是工作，有时使用ASP.NETMVC进行完全回发

asp.net-mvc asp.net-mvc-3 jquery

Asp.net mvc Ajax.BeginForm（…）不总是工作，有时使用ASP.NETMVC进行完全回发,asp.net-mvc,asp.net-mvc-3,jquery,asp.net-ajax,Asp.net Mvc,Asp.net Mvc 3,Jquery,Asp.net Ajax,我一辈子都搞不懂为什么这篇回帖有时会像它应该的那样使用ajax，有时却不使用。以下是相关代码： JS: 指数 $（函数（）{ $（'#nav'）.dropy（）； }); $（文档）.ready（函数（）{ $（“#targetStartDate”）.datepicker（）； $（“#targetEndDate”）.datepicker（）； $（“#ticketsHTMLTable”）.tablesorter（{sortList:[[0,0]，[1,0]}）； $（“.fakeLink”）

我一辈子都搞不懂为什么这篇回帖有时会像它应该的那样使用ajax，有时却不使用。以下是相关代码：

JS:


指数
$（函数（）{
$（'#nav'）.dropy（）；
});
$（文档）.ready（函数（）{
$（“#targetStartDate”）.datepicker（）；
$（“#targetEndDate”）.datepicker（）；
$（“#ticketsHTMLTable”）.tablesorter（{sortList:[[0,0]，[1,0]}）；
$（“.fakeLink”）.mouseover（函数（）{
$（this.css（“颜色”、“红色”）；
});
$（“.fakeLink”）.mouseout（函数（）{
$（this.css（“颜色”、“黑色”）；
});
});

以下是我的观点（剃须刀）：

@使用（Ajax.BeginForm（“索引”，“问题”），新的AjaxOptions
{
HttpMethod=“GET”，
UpdateTargetId=“ticketsTable”，
InsertionMode=InsertionMode.Replace
}))
{
优先
地位
业务单位
开始日期
结束日期
 
@Html.DropDownList（“targetPriorityID”，
新建选择列表（ViewBag.Priorities as System.Collections.IEnumerable，
“ID”、“Title”）、“All”、新的{@onchange=“this.form.submit（）；”}）
@Html.DropDownList（“targetStatusID”，
新建选择列表（ViewBag.Status为System.Collections.IEnumerable，
“ID”、“Title”）、“All”、新的{@onchange=“this.form.submit（）；”}）
@Html.DropDownList（“targetBusinessUnitID”，
新建SelectList（ViewBag.BusinessUnits为System.Collections.IEnumerable，
“ID”、“Title”）、“All”、新的{@onchange=“this.form.submit（）；”}）
@TextBox（“targetStartDate”，new{onchange=“this.form.submit（）；”}）
@TextBox（“targetEndDate”，new{onchange=“this.form.submit（）；”}）






}
@Html.Partial（“\u AllTickets”，模型）

最后是控制器

    [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);

    }

[HttpPost]
公共操作结果索引（int-targetPriorityID=-1，int-targetBusinessUnitID=-1，int-targetStatusID=-1，字符串targetStartDate=“”，字符串targetEndDate=“”）
{
Repository priorityRepository=新存储库（）；
Repository businessUnitRepository=新存储库（）；
Repository statusRepository=新存储库（）；
ViewBag.Priorities=priorityRepository.GetAll（）；
ViewBag.BusinessUnits=businessUnitRepository.GetAll（）；
ViewBag.Statuses=statusRepository.GetAll（）；
var results=problemRepository.GetAll（）；
结果=（targetPriorityID！=-1）？结果。其中（t=>t.PriorityID==targetPriorityID）：结果；
结果=（targetBusinessUnitID！=-1）？结果。其中（t=>t.BusinessUnitID==targetBusinessUnitID）：结果；
结果=（targetStatusID！=-1）？结果。其中（t=>t.StatusID==targetStatusID）：结果；
结果=（targetStartDate！=“”）？结果。其中（t=>t.DateReported>=DateTime.Parse（targetStartDate））：结果；
结果=（targetEndDate！=“”）？结果。其中（t=>t.DateReported我建议您使用稍后将被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>

我建议您的另一个改进是使用视图模型，去掉ViewData
，并使用强类型帮助程序。
我建议您使用稍后将被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>

我建议您的另一个改进是使用视图模型，去掉ViewData
，并使用强类型帮助程序。
我想知道Request.IsAjaxRequest（）是否是问题的根源。我将考虑删除该代码，并始终返回PartialView（“\u AllTickets”，results）；
取而代之。
我想知道Request.IsAjaxRequest（）是否是导致问题的原因。我会考虑删除该代码，并始终返回部分视图（“所有票据”，结果）；
相反。
我看到的一个问题是，Razor视图中的AJAX选项指定GET HTTP方法，但控制器操作上的操作筛选器指定POST。
我看到的一个问题是，Razor视图中的AJAX选项指定GET HTTP方法，但控制器操作上的操作筛选器指定POST Darin，我会在有机会的时候尝试这种方法，但是我以前的方法有什么根本性的错误吗？单独Ajaxing的好处是什么？还有，强类型助手是什么意思？这在很大程度上是有效的，但我必须给所有的DropDownList一个类并添加这一点JS。$（“.ajaxForcePost”）.change（函数（）{/$（'form'）.submit（）；}）；我不确定你的解决方案为什么不能像看上去那样直接起作用。即使这个解决方案也不能100%起作用。当然比上一个解决方案更有效。Darin，我会在有机会的时候尝试这种方法，但是我以前的方法有什么根本性的错误吗？单独一个解决方案的好处是什么JAXifying它？还有，你说的强类型助手是什么意思？这在很大程度上是有效的，但我必须给所有的DropDownList一个类，并添加这一点JS.$（“.ajaxForcePost”）.change（function（）{/$（'form'）.submit（）}）；我不确定为什么您的解决方案不能直接运行，因为它看起来应该运行。即使这个解决方案也不能100%运行。当然比上一个解决方案更有效。结果是，当
@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>

$(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);
            }
        });
    });
});