title: Pass data from jquery dialog in partial view to main view
body: <p>I am new to mvc and to jQuery so I'm not entirely sure how best to phrase this question to get the best response. I'm seeing a number of posts that give me bits of what I need but I'm still not able to put them all together into a working solution.</p>
  
  <p><strong>EDIT 18 Sep 2013</strong></p>
  
  <p>I have an mvc4 app that has a number of views that need to lookup a person record from db. What I'm looking fir is a solution that will on the click of button open a jqueryui dialog that will allow user to search db for person rec. I also have views that need to lookup a number of person records to populate the model (ie CaseWorkerPersonID, ParentPersonID, ChildPersonID etc). The dialog is to have a jqueryui autocomplete widget and when the user selects person from autocomplete list then the view that initiated the search dialog needs to have reference to the selected person record.</p>
  
  <p>Cheers </p>
  
  <p><strong>EDIT</strong>
  OK so here is an example of what Im trying to do.</p>
  
  <p>I have a Case/Details ...</p>
  
  <pre><code>@model CENSimple.Models.Case
  @{
      ViewBag.Title = "Details";
  }
  @section Scripts{
  
  &lt;script type="text/javascript"&gt;
  //var linkObj;
  $(function () {
      $(".editLink").button(); //turn the editLink class links to buttons
  
      $('#updateDialog').dialog({
          autoOpen: false,
          width: 400,
          resizable: false,
          modal: true,
          buttons: {
              "Update": function () {
                  $(this).dialog("close");
  
                  //psuedo code
                  if(this update from "Add CW to case")
  {
                  $('#SelectedPersonFromAddCWToCase').text('PersonID: ' + $('#selectedPersonID').val() + ' selected');
  } else
  {
                  $('#SelectedPersonFromAddPersonToCase').text('PersonID: ' + $('#selectedPersonID').val() + ' selected');
  }
  
              },
              "Cancel": function () {
                  $(this).dialog("close");
                  $('#selectedPersonID2').text('Person search cancelled');
              }
          }
      });
  
  
      $(".editLink").click(function () {
  
          //change the title of the dialog
          var linkObj = $(this);
          var dialogDiv = $('#updateDialog');
          var viewUrl = linkObj.attr('href');
          $.get(viewUrl, function (data) {
              dialogDiv.html(data);
              dialogDiv.dialog('open');
          });
          return false;
      });
  
  });
  
  &lt;/script&gt;
  
  }
  
  @Html.ActionLink( "Add person to case", "_AddPersonToCase", new { SearchURL = "/Person/SearchPeople"}, new { @class = "editLink" })
  @Html.ActionLink( "Add CW to case", "_AddCWToCase", new { SearchURL = "/Person/SearchPeople2"}, new { @class = "editLink" })
  
  &lt;div id="SelectedPersonFromAddPersonToCase"&gt;&lt;/div&gt;
  &lt;div id="SelectedPersonFromAddCWToCase"&gt;&lt;/div&gt;
  
  &lt;div id="updateDialog" title="Select Person"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>and a Case Controller with the following actions that return the _PersonSearch partial view</p>
  
  <pre><code>public ActionResult _AddPersonToCase(Models.PersonSearch obj)
  {
      return PartialView("_PersonSearch", obj);
  }
  public ActionResult _AddCWToCase(Models.PersonSearch obj)
  {
      return PartialView("_PersonSearch", obj);
  }
  </code></pre>
  
  <p>and a Person Controller with the following actions that return JSON data for my jquery autocomplete widget as follows</p>
  
  <pre><code>    /// &lt;summary&gt;
      /// Example Search action 
      /// &lt;/summary&gt;
      /// &lt;param name="term"&gt;search term from jquery autocomplete&lt;/param&gt;
      /// &lt;returns&gt;value/label list of people matching search term
      /// displaying firstname followed by surname 
      /// &lt;/returns&gt;
      public JsonResult SearchPeople(string term)
      {
          Repositories.PersonRepository repo = new Repositories.PersonRepository();
          var results=repo.GetSearchResults(new Models.PersonSearchCriteria { Name = term });
  
          var results1 = results
                          .OrderBy(s =&gt; s.FirstName)
                          .Select(s =&gt; new 
                          { 
                              label = s.FirstName + " " + s.LastName, 
                              value = s.ID 
                          });
  
          JsonResult r = Json(results1, JsonRequestBehavior.AllowGet);
  
          return r;
      }
  
      /// &lt;summary&gt;
      /// Example Search action 
      /// &lt;/summary&gt;
      /// &lt;param name="term"&gt;search term from jquery autocomplete&lt;/param&gt;
      /// &lt;returns&gt;value/label list of people matching search term
      /// displaying surname followed by firstname
      /// &lt;/returns&gt;
      public JsonResult SearchPeople2(string term)
      {
          Repositories.PersonRepository repo = new Repositories.PersonRepository();
          var results = repo.GetSearchResults(new Models.PersonSearchCriteria { Name = term });
          var results1 = results
                          .OrderBy(s =&gt; s.FirstName)
                          .Select(s =&gt; new
                          {
                              label = s.LastName + ", " + s.FirstName ,
                              value = s.ID
                          });
  
          JsonResult r = Json(results1, JsonRequestBehavior.AllowGet);
  
          return r;
      }
  </code></pre>
  
  <p>and finally a _PersonSearch partial view as follows...</p>
  
  <pre><code>    @model CENSimple.Models.PersonSearch
          &lt;script&gt;
  
              $(function () {
  
                  $("#Name").autocomplete({
  
                      source:'@Model.SearchURL',
                      minLength: 2,
                      select: function (event, ui) {
  
                          //Put the selected label into the input 
                          //If this is not done then the value will be in input
                          this.value = ui.item.label;
  
                          $('#SelectedPersonID').val(ui.item.value);
                          event.preventDefault(); // Prevent the default focus behavior.
  
                      },
                      focus: function (event, ui) {
                          this.value = ui.item.label;
                          event.preventDefault(); // Prevent the default focus behavior.
                          return false;
                      }
                  });
              });
  
          &lt;/script&gt;
  
  
      &lt;div class="ui-widget"&gt;
          &lt;label for="searchPerson"&gt;Name: &lt;/label&gt;
          @Html.EditorFor(m=&gt;m.Name)
  
      &lt;/div&gt;
  
      &lt;div id="searchContext"&gt;&lt;/div&gt;
      @Html.EditorFor(m=&gt;m.SelectedPersonID)
  </code></pre>
  
  <p>What I need is the ability to use my _PersonSearch partial view in multiple places in my /Case/Details view </p>
  
  <pre><code>@Html.ActionLink( "Add person to case", "_AddPersonToCase", new { SearchURL = "/Person/SearchPeople"}, new { @class = "editLink" })
  @Html.ActionLink( "Add CW to case", "_AddCWToCase", new { SearchURL = "/Person/SearchPeople2"}, new { @class = "editLink" })
  </code></pre>
  
  <p>and have each instance of the partial view able to be configured to </p>
  
  <ol>
  <li>use the Case action of my choosing </li>
  <li>use the Person search action of my choosing</li>
  <li>update an element of my choosing on main view when I have selected a value from the autocomplete widget in my partial view and clicked the Update button.  </li>
  </ol>
  
  <p>The code that I have posted gives me this ability to do 1 and 2 but Im stuck on how to satisfy requirement 3 </p>
  
  <p>ie populate <code>&lt;div id="SelectedPersonFromAddPersonToCase"&gt;&lt;/div&gt;</code> when Update button in the <code>"Add person to case"</code> instance of dialog is clicked and have <code>&lt;div id="SelectedPersonFromAddCWToCase"&gt;&lt;/div&gt;</code> when Update button in the <code>"Add CW to case"</code> instance of dialog is selected</p>
  
  <p>All advice gratefully received.</p>