Question

I’m trying to create a way so that when clicking the submit button or a link, do the submission
and remain in the same modal dialog.
My program has two forms within the same dialog, one is not shown until the first is submited and i would like that on submiting the first form load, within the same dialog.

For the load dialog i have this code:

function loadDialog(tag, event, target) {
        event.preventDefault();
        var $loading = $('<img src="../../Content/assets/images/nivo-loader.gif" alt="loading" class="ui-loading-icon">');
        var $url = $(tag).attr('href');
        var $title = $(tag).attr('title');
        var $dialog = $('<div></div>');
        $dialog.empty();
        $dialog
        .append($loading)
        .load($url)
        .dialog({
            autoOpen: false
            , title: $title
            , width: 600
            , modal: true
            , minHeight: 200
            , show: 'fade'
            , hide: 'fade'
        });
});

Then in the Create.cshtml:

@model Mvcproject.Models.MyModel
<script language="javascript" type="text/javascript">
$(function () {
    $("input[type=submit]")
        .button(
        );
    $('a.modalDlg2').live("click", function (event) { loadDialog('#modalDlg', event, '#Receipt Create'); });

    /*$('input.Submit').live("click", function (event) {
        e.preventDefault();
        loadDialog('#modalDlg', event, '#Receipt Create');
    });*/

    $(".demo button").button({
        icons:
    {
        primary: 'ui-icon-plusthick'
    }
    });
});
</script>
<h2>
Add line</h2>
@using (Html.BeginForm())
{
@Html.ValidationSummary(true)

<fieldset class="createReceipt">
    <legend>User login</legend>
    @if (ViewBag.Created)
    {
        <table class="createTable">
            <tr>
                <td rowspan="4">
                    <img src="../../Images/no_image.jpg" width="100" height="100" />
                </td>
                <th colspan="1">
                    @Html.LabelFor(model => model.User.Name)
                </th>
                <td colspan="5">
                    @Html.EditorFor(model => model.User.Name)
                    @Html.ValidationMessageFor(model => model.User.Name)
                </td>
            </tr>
            <tr>
                <th colspan="1">
                    @Html.LabelFor(model => model.User.Email)
                </th>
                <td colspan="5">
                    @Html.EditorFor(model => model.User.Email)
                    @Html.ValidationMessageFor(model => model.User.Email)
                </td>
            </tr>
            <tr>
                <th colspan="1">
                    @Html.LabelFor(model => model.User.Password)
                </th>
                <td colspan="5">
                    @Html.EditorFor(model => model.User.Password)
                    @Html.ValidationMessageFor(model => model.User.Password)
                </td>
            </tr>
            <!--User picture-->
            <tr>
                <td>
                    <input type="file" value="browse" name="Browse" accept="image/gif, image/jpeg, image/jpg" />
                </td>
            </tr>
        </table>
        <p>
            <input type="submit" class="Submit" value="Create" />
            <buttonreceipt style="width: 150px; text-align: left">@Html.ActionLink("Create", "Create")</buttonreceipt>
        </p>
    }
    else
    { 
        <!-- This will be displayed when user data is submited and inserted into database-->
        <table class="createTable">
            <tr>
                <th colspan="1">
                    @Html.LabelFor(model => model.User.Name)
                </th>
                <td colspan="5">
                    @Html.DisplayFor(model => model.User.Name)
                </td>
            </tr>
            <tr>
                <th colspan="1">
                    @Html.LabelFor(model => model.User.Email)
                </th>
                <td colspan="5">
                    @Html.DisplayFor(model => model.User.Email)
                </td>
            </tr>
            <tr>
                <td colspan="1">
                    <img src="@Model.User.Picture"/>
                </td>
            </tr>
        </table>
    }
</fieldset>        


}
@if (!ViewBag.Created)
{
    @Html.Partial("_AddUserInformation");
}

ViewBag.Created is either false or true depending on if user data has been inserted with success into database and that functionality is already done.
And _AddUserInformation.cshtml has other information for the user that is trying to register, like address and country…
Hope this explains better my problem.

Answer 1

You can use the jQuery post() function to send data to an address. You’ll need to pick out the data from your fields manually using jQuery selectors (shouldn’t be difficult) as well as configure a function to receive and treat the data. This link on post should give you what you need to get started. http://api.jquery.com/jQuery.post/