My partial view is sending two Post requests to my action method

Question

I have the following Main menu, which contain an Ajax.Actinolink to render a partial view as follow:-

    @model TMS.ViewModels.VMJoin

    @{
        ViewBag.Title = "Details";
    }

    <h2>Details</h2>


    <div class="row-fluid sortable">        
                    //code goes here
                        <div class="box-content">
    <p>
    @Ajax.ActionLink("Add Network Info", "CreateVMNetwork","VirtualMachine",
        new { vmid = Model.VirtualMachine.TMSVirtualMachineID },
        new AjaxOptions {
     InsertionMode = InsertionMode.Replace,
     UpdateTargetId = "AssignNetwork"  ,
     LoadingElementId = "progress"


    }
    )
    </p>
    <p><img src="~/Content/Ajax-loader-bar.gif" class="loadingimage" id="progress" /></p>
    <div id ="AssignNetwork"></div>
//code goes here
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

And the action method is :-

[HttpPost]
        [ValidateAntiForgeryToken]
        [CheckUserPermissions(Action = "Edit", Model = "Virtual Machine")]
        public ActionResult CreateVMNetwork(AssignIps vmip)
        {
  //code goes here
            if ((Request.Form["IsTMSIPUnique"] == "true") && (!IT360ipunique || !TMSipunique))
            {

                return Json(new { IsSuccess = "False", description = "IP Address Already Exsists." }, JsonRequestBehavior.AllowGet);

            }
            if ((Request.Form["IsTMSMACUnique"] == "true") && (!IT360macunique || !TMSmacunique))
            {

                return Json(new { IsSuccess = "False", description = "MAC Address Already Exsists." }, JsonRequestBehavior.AllowGet);

            }
            if (String.IsNullOrEmpty(vmip.TechnologyIP.IPAddress) || String.IsNullOrEmpty(vmip.TechnologyIP.MACAddress))
            {

                return Json(new { IsSuccess = "False", description = "Please Make sure to insert both values." }, JsonRequestBehavior.AllowGet);
            }
            if (ModelState.IsValid)
            {
                try
                {
                    string ADusername = User.Identity.Name.Substring(User.Identity.Name.IndexOf("\\") + 1);
                    repository.InsertOrUpdateIPs(vmip.TechnologyIP,ADusername);
                    repository.Save();

                    return PartialView("_networkrow",vmip);

                }
                catch (Exception ex)
                {

                    //ModelState.AddModelError(string.Empty, "Error occurred: " + ex.InnerException.Message);
                    return Json(new { IsSuccess = "False", description = ex.InnerException.InnerException.Message.ToString() }, JsonRequestBehavior.AllowGet);
                }

            }

            return PartialView("_CreateVMNetwork", vmip);

        }

And the rendered partial view from the action method call is:-

@model TMS.ViewModels.AssignIps

    @if (this.ViewContext.FormContext == null) 
{
    this.ViewContext.FormContext = new FormContext(); 
}

@using (Ajax.BeginForm("CreateVMNetwork", "VirtualMachine", new AjaxOptions

{
    InsertionMode = InsertionMode.InsertAfter,
    UpdateTargetId = "networktable",
    LoadingElementId = "loadingimag",
    HttpMethod= "POST",
    OnSuccess="submitform"





}))
{
    @Html.ValidationSummary(true)
    @Html.HiddenFor(model=>model.TechnologyIP.TechnologyID)

 @Html.AntiForgeryToken()
<div>
<span class="f">IP Address</span> 

@Html.EditorFor(model => model.TechnologyIP.IPAddress)
@Html.ValidationMessageFor(model => model.TechnologyIP.IPAddress)                                              

   <input type="CheckBox" name="IsTMSIPUnique" value="true" @(Html.Raw(Model.IsTMSMACUnique ? "checked=\"checked\"" : "")) /> IP Unique.    | 
 <span class="f"> MAC Address</span>       
@Html.EditorFor(model => model.TechnologyIP.MACAddress)
@Html.ValidationMessageFor(model => model.TechnologyIP.MACAddress)                                              

 <input type="CheckBox" name="IsTMSMACUnique" value="true" @(Html.Raw(Model.IsTMSMACUnique ? "checked=\"checked\"" : "")) /> MAC Unique.

</div>


       <input type="submit" value="Save" class="btn btn-primary"/>
}

    @Scripts.Render("~/bundles/jqueryval")

But the problem I am facing is that when clicking on the Save button inside the rendered partial view, two post requests will be sent. I think the problem is related to the fact that I have two references to the @Scripts.Render("~/bundles/jqueryval") scripts;one in the main view while the other in the partial view. But at the same time I can not delete any of these references since on the main view I need the ajax features and on the partial view I need the jquery validation.

Can anyone advice please how to solve this duplicate requests problem ?

score 0 · Answer 1 · answered Dec 19 '13 at 14:52

You don't actually need to render the scripts twice. You can access the functionality of the scripts so long as it's rendered in the main view that the partial view is being loaded into. The solution is NOT to load the scripts a second time, but to take the functions the script has given you to replicate what it does when it's loaded. Use the validation module to parse the html elements again. This can be done with a simple call to the following function:

$.validator.unobtrusive.parse(selector)

You shouldn't need to parse the entire html page again, only parse the newly inserted elements. That way you get all the ajax and unobtrusive functionality loaded in the main view, and you call it when your partial view is loaded so everything works out without the double post.

My partial view is sending two Post requests to my action method

1 Answers1