Update View using Ajax BeginForm on Form Submit in ASP.Net MVC

Hello everyone,

I have a modal that has a button which opens up another modal. In the first modal I have a dropdownlist of contacts and in the second modal it adds a contact. Once I add the contact I want to refresh the first modal so the newly added contact appears in the dropdownlist. I am using ajax

Here is my code.

Modal 1
<!-- CREATE Service Quote -->
@using (Ajax.BeginForm("CreateServiceQuote", "Service", new AjaxOptions() { HttpMethod = "POST", UpdateTargetId = "ajaxCreate" }))
{
    <div class="modal" id="AddQuote" tabindex="-1" role="dialog" aria-labelledby="lblAjaxCreate" aria-hidden="true">
        <div class="modal-dialog" role="document" style="width:750px;">
            <div class="modal-content">                
                <div class="modal-body" id="ajaxCreate">
                    @Html.Partial("SQcreate")
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                    <input type="submit" class="btn btn-success" value="Create Quote" />
                </div>
            </div>
        </div>
    </div>
}
<!--Sqcreate - -->
@model Messer_PartNumbers.Models.ServiceModel
@{
    HtmlHelper.UnobtrusiveJavaScriptEnabled = true;
}
@Html.AntiForgeryToken()
    <tr>
        <th>
            @* CONTACT - DROPDOWNLIST * SELECT ONLY AVAILABLE *~ database = varchar*@
            <div class="form-group">
                @Html.LabelFor(x => x.ServiceVM.ContactName, htmlAttributes: new { @class = "control-label col-3" })
                <div class="col-9">
                    @*@Html.TextBoxFor(x => x.ServiceVM.ContactName, new { @class = "form-control" })  Model.Contacts  c => c.ServiceVM.ContactName*@
                    @Html.DropDownListFor(c => c.ServiceVM.ContactName, Model.Contacts, "Select Contact", new { @class = "form-control" })
                    @Html.ValidationMessageFor(x => x.ServiceVM.ContactName, "", new { @class = "text-danger" })
                </div>
            </div>
        </th>
        <th>
            <button type="button" class="btn btn-info" id="btnSQopenCon" @*data-toggle="modal" data-target="zipModal"*@>New Contact</button>
        </th>
    </tr>
<!--Modal 2 -->
<!-- CREATE CONTACT -->
@using (Ajax.BeginForm("CreateSQcontact", "Service", new AjaxOptions() { HttpMethod = "POST", UpdateTargetId = "ajaxContact", OnSuccess = "contactSuccess" }))
{
    <div class="modal" id="AddSQcontact" tabindex="-1" role="dialog" aria-labelledby="lblAjaxContact" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">                
                <div class="modal-body" id="ajaxContact">
                    @Html.Partial("SQcontact")
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
                    <input type="submit" class="btn btn-success" value="Create Contact" />
                </div>
            </div>
        </div>
    </div>
}
SQcontact
@model Messer_PartNumbers.Models.ServiceModel
@{
    HtmlHelper.UnobtrusiveJavaScriptEnabled = true;
}

@Html.AntiForgeryToken()

@Html.HiddenFor(x => x.ServiceContact.ContactID)

<div class="form-group">
    @Html.LabelFor(x => x.ServiceContact.ContactName, htmlAttributes: new { @class = "control-label col-3" })
    <div class="col-9">
        @Html.TextBoxFor(x => x.ServiceContact.ContactName, new { @class = "form-control" })
        @Html.ValidationMessageFor(x => x.ServiceContact.ContactName, "", new { @class = "text-danger" })
    </div>
</div>
<div class="form-group">
    @Html.LabelFor(x => x.ServiceContact.ContactPhone, htmlAttributes: new { @class = "control-label col-3" })
    <div class="col-9">
        @Html.TextBoxFor(x => x.ServiceContact.ContactPhone, new { @class = "form-control" })
        @Html.ValidationMessageFor(x => x.ServiceContact.ContactPhone, "", new { @class = "text-danger" })
    </div>
</div>