0

假设我有一组机构，每个机构都知道他的父亲是谁，一个机构可以有很多孩子。现在我为这个问题创建了一组级联下拉列表，所以在第一个找到没有父亲的下拉列表（如果可能的话，第 0 层），一旦用户选择了一个项目，第二个列表上的列表就会加载它的孩子（如果它有任何孩子）等等，直到第 3 层，这是我的代码：

索引.cshtml：

@model  WebUI.Controllers.IndexViewModel
<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript">  </script>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>




 @Html.Partial("ParentEstablishments",Model)
 <div id="FirstHeritage">@Html.Partial("FirstHeritageChildren",Model)</div>
 <div id="SecondHeritage">@Html.Partial("SecondHeritageChildren",Model)</div>

每个局部视图都有一个 ajax 形式，如下所示：

@model WebUI.Controllers.IndexViewModel

@using (Ajax.BeginForm("SelectParent","Ticket",new   AjaxOptions{UpdateTargetId="FirstHeritage"}))
{

 <fieldset>
    <legend>Entidad departamental</legend>

    @Html.DropDownListFor( 
        m => m.SelectedParentId , 
        new SelectList( Model.AvailableParents , "EstablishmentId" , "Name" ) , 
        "[Por favor seleccione una entidad departamental]" 
    )
    <input type="submit" value="Select" />
</fieldset>
}

所以我想要创建的是一个提交按钮，让用户告诉我他选择了他需要的实体，并在我的控制器上调用一个方法，在那里我检查每个 id 的值，我试图将部分视图放在表单中但是ajax表单的每个提交按钮都会调用我创建的表单的方法，我怎样才能在不干扰ajax表单的情况下制作一个按钮？

4

2 回答 2

1

你不能，基本上。使 AJAX 表单成为 AJAX 表单的脚本绑定到提交事件，因此任何提交都会被捕获。

请记住，ASP.NET 中的所有 HTML 帮助程序和控件都是为了涵盖常见场景并在您实际处于常见场景中时让您的生活更轻松。您的代码获得的“自定义”越多（例如将执行常规 POST 而不是 AJAX POST 的第二个提交按钮），您需要做的工作就越多（并且您应该使用内置帮助程序和控件的次数越少）。

只需创建一个常规表单 ( Html.BeginForm)，添加两个提交按钮，然后在 AJAX 版本上附加一个单击事件，然后自己将 POST 作为 AJAX 发送。

于 2013-04-01T19:46:39.200 回答
1

像下面这样修改按钮。

<input type="button" value="Select" class="btnSubmit" />

修改表单标签，如下所述

@using (Ajax.BeginForm("SelectParent","Ticket", FormMethod.Post, 
                                                          new { id = "myForm" }))
{
}

如下所述修改 Div。添加一个属性，该属性的值对应于控制器的 Action 方法。

<div id="FirstHeritage" attr-Url="@Url.Action("ActionName", "ControllerName", 
new { area = "AreaName" })"></div>

现在在 Jquery 中。请按照以下步骤操作。

  1. 加载局部视图
  2. 获取 Div 属性值
  3. 将 On 用于 Button 事件。
  4. 阿贾克斯请求

jQuery

$(document).ready(function () {
    var FirstHeritage = $('#FirstHeritage');
    var url = FirstHeritage.attr('attr-Url');
    FirstHeritage.load(url, function () {
        var $form = $('#myForm');
        $.validator.unobtrusive.parse($form);
        $(document).on('click', '.btnSubmit', function () {
            if ($form.valid()) {
                $.ajax({
                    url: Url,
                    async: true,
                    type: 'POST',
                    beforeSend: function (xhr, opts) {

                    },
                    contentType: 'application/json; charset=utf-8',
                    complete: function () { },
                    success: function (data) {
                        $form.html(data);
                        $form.removeData('validator');
                        $form.removeData('unobtrusiveValidation');
                        $.validator.unobtrusive.parse($form);
                    }
                });
            }
        });
    });
});

希望这会帮助你。

于 2013-04-02T07:25:41.403 回答