Question

The scenario I want to implement is stated as follows:

I am using MVC 3 with razor view.

On the click of text box (call it Result Text Box), open a dialog from the Home View (which is a different view, the Add View) and carrying a postback to Home controller action.

On the dialog (which is Add View), simply input two numbers for addition and on its submit, does a post-back on Add view controller action.

Now, when the Add controller action processing completes, I want to do the addition of the numbers and close the current dialog (Add View) and updating the Result Text Box present on the parent view (Home view) with the addition result.

Note: After closing the dialog I dont want the parent view to be reloaded or refreshed.

Now, Where I am facing the problem is how to

1) fetch hidden field value (container addition value) and set to the Result test box on parent page?

2) close the dialog(add view) from the dialog itself? without refreshing the parent view?

code:

<h2> Input numbers to add</h2>
    @using (Html.BeginForm("About","Home",FormMethod.Post, new {id = "dialogchildform"}))
    { 

         @Html.Hidden("hdnresult", ViewData["result"], new { id = "hdnres" })

    <div style="position: relative; margin-left: 200px; top: 80px">

        <fieldset>


            @Html.ValidationSummary(true)
            <div class="editor-label">
                Value 1
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.num1, new { id = "num1" })
                @Html.ValidationMessageFor(model => model.num1)
            </div>
            <div class="editor-label">
                Value 2
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.num2, new { id = "num2" })
                @Html.ValidationMessageFor(model => model.num2)
            </div>
        </fieldset>
        <p>
            <input type="submit" value="Add and Retrun" id="inputSubmit" />
        </p>
    </div>

    }




    <script type="text/javascript">

           $(document).ready(function () {
               $("#inputSubmit").click(function () {

                   document.forms('dialogchildform').submit();

            // txtParentResult is a Textbox on prent view to be updated
                   document.getElementById('txtParentResult').value 
= document.forms('dialogchildform').hdnres.value; 
// not updating the parent textbox


                  // $(window.document).dialog('close');  
//gives error - Microsoft JScript runtime error: Object doesn't support property or method 'dialog'
                  //$("#mydiag").dialog("close");  
// also gives error

                  //jQuery(".ui-dialog-content").dialog("close");  
// again gives error -  Microsoft JScript runtime error: Object doesn't support property or method 'dialog'


               });        
           });

    </script>

Controller Action:

[HttpPost]
        public ActionResult Add(AddNum vAddNum)
        {
            objAddNum = vAddNum;
            int result = objAddNum.AddNumbers();
            ViewData["_ActionCloseDialog"] = "true";
            ViewData["result"] = result;
            return View();
        }

Answer 1

Got the solution.

Instead of using the jQuery function on the dialog view, I have used dialog buttons on the parent view itself.

Since, the dialog is defined as global varibale in javascript function on the parent .cshtml and encapsulates child view in the div, has access to controls on both the views.