如何解决Ajax.BeginForm使用asp.net mvc

时间:2017-06-26 06:46:56

标签: javascript jquery asp.net-mvc c#-4.0 ajax.beginform

我的问题:

  1. 当用户使用Ajax.BeginForm点击保存按钮时,我的主页面有一些字段,我保存了这个成功运作的详细信息。

  2. 在主窗体内部有一个按钮(任务),当用户点击该按钮部分窗口将打开然后它们将填充一些细节。当部分窗口保存按钮自动点击主页面保存动作方法正在调用...首先它保存部分保存详细信息然后立即保存主页面详细信息然后我得到两次成功保存消息。

  3. 当主页面保存按钮单击时,它应该保存主页面字段。当部分页面保存按钮单击时,它应该只保存部分页面字段(部分页面保存我使用jquery。

  4. 主页:

         @using (Ajax.BeginForm("savePhase", "Search", new AjaxOptions() { HttpMethod = "POST", UpdateTargetId = "ChmHeaderPage",OnSuccess= "OnSuccessMain" }, new { enctype = "multipart/form-data" }))
            {
                @Html.HiddenFor(model => model.ChangeRequestList.FirstOrDefault().changeId);
                @Html.HiddenFor(model => model.ChangeRequestList.FirstOrDefault().Phase);
    
                <div class="col-md-offset-0 panel-body">    
                    <div class="form-group">
                        @Html.LabelFor(model => model.Importance, htmlAttributes: new { @class = "col-md-3 control-label" })
                        <div class="col-md-3">
                            @Html.DropDownListFor(model => model.ImportanceVal, new SelectList(Model.Importance, "OptionId", "OptionName", Model.ImportanceVal), new { @class = "form-control", @Title = "Message Need to be Show" })
                        </div>
    
                        @Html.LabelFor(model => model.Urgency, htmlAttributes: new { @class = "col-md-2 control-label" })
                        <div class="col-md-3">
                            @Html.DropDownListFor(model => model.UrgencyVal, new SelectList(Model.Urgency, "OptionId", "OptionName", Model.UrgencyVal), new { @class = "form-control", @Title = "Message Need to be Show" })
                        </div>
                    </div>
    
                    <div class="col-md-12 ">
                        @Html.Label("Enter Task*")
                        <button type="button" id="Analysisbtn" class="btn btn-link " data-toggle="modal" data-target="#myModal">Select Task</button>
    
    
    
                        <!-- Modal -->
                        <div id="myModal" class="modal fade" role="dialog">
                            <div class="modal-open strech-modal-dialog">
    
                                <!-- Modal content-->
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                                        <h4 class="modal-title">Analysis</h4>
                                    </div>
                                    <div class="modal-body">
                                        @Html.Partial("_TaskPage")
                                    </div>
    
                                </div>
    
                            </div>
                        </div>
                        </div>
                        <!-- Form actions -->
                        <div class="row panel-body">
                            <div class="col-md-12 text-center">
                                <button type="submit" name="buttonValue" class="btn btn-danger" value="Close">Save & Close</button>
    
                                <button type="submit" name="buttonValue" class="btn btn-primary" value="Save">Save</button>
    
                            </div>
                        </div>
    
                    </div>
            }
    

    部分页面:

            @model www.ChangeManagementTool.ViewModels.SearchViewModel
          <div class="panel-group" id="accordion" role="tablist" aria-
           multiselectable="true">
          <div class="panel panel-default">
           <div class="panel-heading" role="tab" id="headingOne">
            <h4 class="panel-title">
                <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                    <i class="more-less glyphicon glyphicon-plus"></i>
                     Task
                </a>
            </h4>
        </div>
        <div id="collapseOne" class="panel-collapse collapse first" role="tabpanel" aria-labelledby="headingOne">
            <div class="panel-body">
    
                        <div class="table-responsive center-block" data-tab-content="@item.Key" style="display:@displayText">
                            <table class="table table-responsive sena" id=@item.Key>
    
                                <tr>
                                    <th>Department</th>
                                    <th>Plant</th>
                                    <th>Country</th>
                                    <th>Responsibles</th>
                                    <th>DueDate</th>                                  
                                </tr>
    
                                <tbody>
    
                                    @foreach (var analysisTask in item.Value)
                                    {
    
                                        <tr> 
                                            <td>
                                              --DisplayFor code
                                            </td>
                                            <td>
                                              --DisplayFor code
                                            </td>
                                            <td>
                                              --DisplayFor code
                                            </td>
                                            <td>
                                              --DisplayFor code
                                            </td>
                                            <td>
                                                --DisplayFor code
                                            </td>
    
                                        </tr>
    
                                    }
                                    </tbody>
    
                            </table>
                        </div>
    
                    }
                    <div class="form-group">
                        <div class="col-md-12 text-center">
                            <button type="submit" id="btnSaveReal" class="btn btn-primary ">Save Task </button>
                        </div>
                    </div>
                }
            </div>
        </div>
    </div>  
    

    jquery保存编码

                      <script type="text/javascript"> 
                          $('#btnSaveReal').click(function (e) {
    
        var listex = [];
        debugger;
        $('#RealTask tbody tr').each(function (index, ele) {
            var saveItem2 = {
                ChangeId: $('#ChangeIdR').val(),
                PlantId: $('#PlantIdR' + index).val(),
                DepartmentId: $('#DepartmentIdR' + index).val(),
                MstTaskId: $('#MstTaskIdR' + index).val(),
                AffectedItemId: $('#AffectedItemIdR' + index).is(":checked")
            }
            listex.push(saveItem2);
        })
    
        //Save Coding
        var url = applicationRoot + '/Search/SaveRealizationTaskdetails';
        $.ajax({
            url: url,
            type: "POST",
            data: JSON.stringify({ 'objmodelRel': listex, actionR: 'AnalyzeRealize' }),
            dataType: "json",
            traditional: true,
            contentType: "application/json; charset=utf-8",
            success: function (Data) {
                if (Data.status) {
                    alert(Data.responseText);
                } else {
                    alert(Data.responseText);
                }
            },
            error: function () {
                alert("An error has occured!!!");
            }
        });
    });
    
    function toggleIcon(e) {
        $(e.target)
        .prev('.panel-heading')
        .find(".more-less")
        .toggleClass('glyphicon-plus glyphicon-minus');
    }
    $('.panel-group').on('hidden.bs.collapse', toggleIcon);
    $('.panel-group').on('shown.bs.collapse', toggleIcon);
    

    控制器代码:

        public ActionResult savePhase(SearchViewModel objmodel, string buttonValue)
        {
        save code---------------
         return RedirectToAction("FetchChgReqDetails");
        }
    
         public JsonResult SaveRealizationTaskdetails(List<ChangeRequestRealizationTask> objmodelRel, string actionR)
        {
           --save code      
            return new JsonResult { Data = new { status = true, responseText = "Successfuly saved!" }, JsonRequestBehavior= JsonRequestBehavior.AllowGet };
        }
    

1 个答案:

答案 0 :(得分:1)

根据您的问题,如果对您有帮助,我建议您尝试下面这个。

首先更改部分视图按钮类型=“按钮”而不是type =“submit”

并在主表单上提交所有数据,包括使用AJAX的部分视图数据