Ajax.Beginform is posting form values twice in MVC?


I am using Ajax.BeginForm in Modal pop-up, but when submitting form values, it is calling controller twice and hence saving the same form details twice in the database, what can be the cause of it, i am not able to find any good solution on internet, I am using PartialView in ActionMethod to return Ajax.Beginform view

Here is the PartialView code

@model MyMVCApp.Model.OrderNowViewData
@{
    Layout = null;
}


@using (Ajax.BeginForm("Action", "Controller",new AjaxOptions{ HttpMethod = "POST", UpdateTargetId = "ModalContent" }))
{
    @Html.AntiForgeryToken()

    <fieldset>
        <legend>Contact Information</legend>
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Contact Name :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="ContactName" name="ContactName" value="@Model.ContactName"/>

            </div>
        </div>
     </div>

    <br/>
        <div class="row">
            <div class="col-lg-2">
                <div class="form-group">
                    <label>Contact Email :-</label>

                </div>
            </div>
            <div class="col-lg-10">
                <div class="form-group">
                    <input type="text" class="form-control" id="ContactEmail" name="ContactEmail" value="@Model.ContactEmail" />

                </div>
            </div>
        </div>
        <br/>
        <div class="row">
            <div class="col-lg-2">
                <div class="form-group">
                    <label>Contact Phone :-</label>

                </div>
            </div>
            <div class="col-lg-10">
                <div class="form-group">
                    <input type="text" class="form-control" id="ContactPhone" name="ContactPhone" value="@Model.ContactPhone" />

                </div>
            </div>
        </div>
</fieldset>

<fieldset>
    <legend>Billing Address</legend>
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Address:-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="BillingAddress" name="BillingAddress" value="@Model.Address" />

            </div>
        </div>
    </div>

    <br />
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>City:-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="BillingCity" name="BillingCity" value="@Model.City" />

            </div>
        </div>
    </div>
    <br />
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>State :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="BillingState" name="BillingState" value="@Model.State" />

            </div>
        </div>
    </div>
    <br/>
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Country :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="BillingCountry" name="BillingCountry" value="@Model.Country" />

            </div>
        </div>
    </div>
</fieldset>
<fieldset>
    <legend>Customer Main Contact Information</legend>
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Name :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="CustomerContactName" name="CustomerContactName" />

            </div>
        </div>
    </div>

    <br />
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Email :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="CustomerContactEmail" name="CustomerContactEmail" />

            </div>
        </div>
    </div>
    <br />
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Phone :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="CustomerContactPhone" name="CustomerContactPhone" />

            </div>
        </div>
    </div>
</fieldset>

<fieldset>
    <legend>Technical Contact</legend>
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Name :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="TechnicalContactName" name="TechnicalContactName" />

            </div>
        </div>
    </div>

    <br />
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Email :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="TechnicalContactEmail" name="TechnicalContactEmail" />

            </div>
        </div>
    </div>
    <br />
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Phone :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="TechnicalContactPhone" name="TechnicalContactPhone" />

            </div>
        </div>
    </div>
</fieldset>

<fieldset>
    <legend>Billing Contact</legend>
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Name :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="BillingContactName" name="BillingContactName" value="@Model.BillingContactName" />

            </div>
        </div>
    </div>

    <br />
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Email :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="BillingContactEmail" name="BillingContactEmail" value="@Model.BillingContactEmail" />

            </div>
        </div>
    </div>
    <br />
    <div class="row">
        <div class="col-lg-2">
            <div class="form-group">
                <label>Phone :-</label>

            </div>
        </div>
        <div class="col-lg-10">
            <div class="form-group">
                <input type="text" class="form-control" id="BillingContactPhone" name="BillingContactPhone" value="@Model.BillingContactPhone" />

            </div>
        </div>
    </div>
</fieldset>


    <button type="submit" class="btn btn-primary SendMail">Submit</button>
}


Any help?? Any idea what is causing this, I am adding Ajax.BegnForm Required js files in the Main view(calling method, this is modal pop-up)


Asked by:- Sam
1
: 10704 At:- 11/28/2017 1:11:45 PM
C# Ajax.BeginForm asp.net ajax.beginform sends multiple requests ajax.beginform submits multiple times

you have probably included jquery.unobtrusive-ajax.js twice, as mentioned by @vipin 1
By : neena - at :- 11/30/2017 11:13:42 AM






2 Answers
profileImage Answered by:- Vipin

There can be possibly two cause of this issue:

  1. You are not returning PartialView but a View from ActionMethod which is sending all the js files again.(But you are doing that as you have written in the question)
  2. Another cause(probable answer) is you are referencing jquery.unobtrusive-ajax.js files twice,i.ex you may have included the below script twice (in main view or may be in partial view)
    <script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>?
3
At:- 11/29/2017 6:42:05 AM Updated at:- 11/29/2017 6:42:20 AM
Thanks, I was are referencing jquery.unobtrusive-ajax.js files twice, in partial View and Main view both 0
By : Sam - at :- 12/6/2017 12:29:14 PM


profileImage Answered by:- SnehalSawant

Instead of ajax begin form try to use normal form tag to. Post data 

Or.. 

Check jquery references 

1
At:- 11/28/2017 4:55:17 PM






Login/Register to answer
Or
Register directly by posting answer/details

Full Name *

Email *




By posting your answer you agree on privacy policy & terms of use