title: How to use JSON data in a view?
body: <p>I am using now the following code in my Edit button in the flexigrid:</p>
  
  <pre><code>var url = '/Client/Details/' + id ;
  $.getJSON(url, function (data) {
      //  setFormControls(data.Id, data.Role, data.Location, data.JobType, data.Description);
      alert(data);
  });
  //location.replace(url);
  RunModalDialog("Edit Client: " + ClientName);
  </code></pre>
  
  <p>And my form is a bit complex view like this</p>
  
  <pre><code>@model CardNumbers.Models.ClientViewModel
   @using (Html.BeginForm(null, null, FormMethod.Post, new { id = "sform", title = "Client Info" }))
  
   {    
    &lt;fieldset&gt;
      &lt;legend&gt;Client Info&lt;/legend&gt;
  
      @Html.ValidationSummary(true)
  
      @Html.HiddenFor(m =&gt; m.ClientId)
      @Html.EditorFor(m =&gt; m.Number, EditorTemplate.TextBox)
  
      @Html.EditorFor(m =&gt; m.Name, EditorTemplate.TextBox)
  
      @Html.EditorFor(m =&gt; m.Client.Address, EditorTemplate.EditBox)
  
  ...
  </code></pre>
  
  <p>where EditorFor is a custom EditorFor. So, it will be a bit hard to manually translate returned json data into forms properties. I am wondering may be there is some simple method to do this kind of translation? I looked into knockout.js but I am not using it in my project (yet), so I am wondering if there is anything else?</p>
  
  <p>Thanks in advance for help.</p>
  
  <p>UPDATE. Just to make my question clearer I am adding a bit more info.</p>
  
  <p>My main view is:</p>
  
  <pre><code>@model CardNumbers.Models.ClientViewModel
  
     @section scripts {
      &lt;script src="@Url.Content("~/Scripts/Clients.js")" type="text/javascript" &gt;&lt;/script&gt;
      }
  
     &lt;form id="frmClientsSearch"&gt;
      &lt;label for="clientNo"&gt;Client No: &lt;/label&gt;
      &lt;input type="number" name="searchClientNo" class="numericOnly" /&gt;&lt;br /&gt;
      &lt;label for="clientName"&gt;Client Name: &lt;/label&gt;
      &lt;input type="search" size="25" value="Please enter the search value"      class="SelectOnEntry"
          name="searchClientName" /&gt;
  
         &lt;input type="button" id="btnClientsSearch" value="Find / Refresh" /&gt;
      &lt;/form&gt;
      &lt;div style="padding-left: 150px; padding-top: 50px; padding-bottom: 50px;"    id="ClientsResults"&gt;
      &lt;table id="flexClients" style="display: none"&gt;
         &lt;/table&gt;
      &lt;/div&gt;
  
      &lt;div id="editor" style="visibility:hidden"&gt;
         @Html.Partial("_ClientForm", Model);
      &lt;/div&gt;
  </code></pre>
  
  <p>And my js file has the following:</p>
  
  <pre><code>    var $dlg = $("#sform").dialog({
      autoOpen: false,
      show: "blind",
      closeOnEscape: true,
      resizable: true,
      width: 1200,
      height: 750,
      minHeight: 600,
      minWidth: 950
      });
  
      function RunModalDialog(title, url)
  {    
      if (title)
          $dlg.dialog("option", {"title": title });
  
      if (url)
      {        
          $dlg.load(url).dialog("option", { "title": title }).dialog("open");
      }
          //$dlg.load(url, function () {
          //    var validator = $("#sform").validate();
          //    if (validator)
          //         validator.resetForm();
          //    $dlg.dialog("option", { "title": title }).dialog("open");
          //});
      else {
          var validator = $("#sform").validate();
          if (validator)
              validator.resetForm();
          $dlg.dialog("open");
         }
      }
  
      function add(com, grid) {
      $('#fntype').val('Add');
      var url = '/Client/Add/'
      //location.replace(url);
      RunModalDialog("Create New Client");
  
     // clearForm();
  
     }
  
       function edit(com, grid)
        {
          $('.trSelected', grid).each(function () {
  
                  var id = $(this).attr('id');
                  id = id.substring(id.lastIndexOf('row') + 3);
                  currentId = id;
                  $('#fntype').val('Edit');
                  var ClientName;
                  ClientName =$('.trSelected td:eq(2)').text();
                  var url = '/Client/Edit/' + id ;
  
                  $.getJSON(url, function (html) {
                      //  setFormControls(data.Id, data.Role, data.Location, data.JobType, data.Description);
                      // alert(data);
                      $('#editor').html(html);
                  });
                 //location.replace(url);
                 RunModalDialog("Edit Client: " + ClientName);
          });
  
      }
  </code></pre>
  
  <p>And now I see the same behavior for Add and Edit, e.g. Edit does not show data.
  <a href="http://www.universalthread.com/Thread%20photos/2013/01562893.jpg" rel="nofollow noreferrer">What I see now http://www.universalthread.com/Thread%20photos/2013/01562893.jpg</a></p>