Close Popup Windows MVC Controller

Question

I have a popup window opened when clicked a link on screen, the view that has the link is _DetailsSurvey. After clicking the link pop up window opens with the content of _EditSurvey view. At the end of _EditSurvey, I have button

<input type="submit" value="Save" />

I am using Ajax option and after button click I insert a row into Survey table if the modelstate is valid.

 @using (Ajax.BeginForm("SubmitSurvey", "Blog", null, new AjaxOptions
    {
    UpdateTargetId = "context",
    InsertionMode = System.Web.Mvc.Ajax.InsertionMode.Replace,
    HttpMethod = "Post",
    Url = "/Home/SubmitSurvey"
    },
    new { surveyItem = @Model }))

What i want to do is if the modelstate is valid after returning from SubmitSurvey method I want the pop up window to be closed.I use the following method to achieve this but it does not work.

    Employee employee;
    if (ModelState.IsValid)
    {

        int employeeId = surveyItem.EmployeeId;
        int trainingId = surveyItem.TrainingId;
        employee = _work.EmployeeRepository.GetSet().
        FirstOrDefault(a => a.Id == employeeId);


        var training = _work.TrainingRepository.GetSet().Where(a => a.EmployeeId == employeeId && a.Id == trainingId).ToList().ElementAt(0);
        training.Survey = surveyItem.survey;
        training.SurveyId = surveyItem.survey.Id;

       /* _work.SurveyRepository.Add(surveyItem.survey);
        _work.SurveyRepository.Save();*/
        _work.TrainingRepository.UpdateAndSave(training);
        _work.TrainingRepository.Save();

    }
    else
    {

        return PartialView("_EditSurvey", surveyItem);
    }
    return JavaScript("window.close()");

I create my popup links as follows

 <tr>
    <td class="view_detail_label">
        Eğitim Adı
    </td>
        <td>

           @Html.ActionLink(
           training.Name.Name, 
           "AddSurvey", 
           new { 
               employeeId = Model.Id, 
               trainingId = training.Id 
           },
           new {
               @class = "addSurvey"
           }
       )
         <div class="result" style="display:none;"></div>             
        </td>            
    </tr>

The called ajax code is as follows:

 $(document).ready(function () {
    $('.addSurvey').click(function () {
        $.ajax({
            url: this.href,
            type: 'GET',
            cache: false,
            context: this,
            success: function (result) {
                $(this).next('.result').html(result).dialog({
                    autoOpen: true,
                    title: 'Anket',
                    width: 500,
                    height: 'auto',
                    modal: true
                });
            }
        });
        return false;
    });
});

In my pop up view I am using previously shown Ajax BeginForm and below that I have the table where user inputs values of the survey. At the end I have the submit button.

<table id="context">
<tr>
    <td>
        <div class="editor-label">
            @Html.LabelFor(model => model.survey.Context)
        </div>
    </td>
    <td>
        <div class="editor-field">
            @Html.EditorFor(model => model.survey.Context)
            @Html.ValidationMessageFor(model => model.survey.Context)
        </div>
    </td>
   </tr>
 <tr>
        <td>
            <input type="submit" value="Kaydet" />
            </td>
    </tr>

I show validation message next to each field if there is any problem with the provided input. If the model was valid I want to do either close the popup window.

Answer 1

It's a very bad idea to open a popup window for many reasons I won't explain here. I spend a very long time to find a solution I could consider as perfect (for me).

In my case, I prepare the view as a partial one (without html, header and body). Just the necessary items do create my functionality in a div.

Then I request my partial view using an ajax query after what I feed a div with my partial view string and I apply the JQuery dialog method to the div for my view to be displayed as a floating dialog box and I bind the OK button to an ajax post to send data to the server. If you want to have the unobstrusive validation to works, you must parse the form with the validator.

I invite you to have a look to my framework, everything you need is available.

https://myprettycms.codeplex.com/SourceControl/latest#461106