title: Kendo UI Grid - Hide/Unhide of column in MVC3
body: <p>My case is a search window with around 20 properties, in which the user can choose to specify search criteria. Each property has a corresponding checkbox which toggles if the prop is included in the search result or not. The search result is then displayed in a kendo grid. </p>
  
  <p>Simplified code which should illustrate the issue (kendo ui complete ver. 2012.2.710):</p>
  
  <pre><code>&lt;input type="checkbox" onclick="fnShowHide(1);" name="showSearchColumn" id="checkShowField1"  /&gt;                                
  
  &lt;div id="example" class="k-content"&gt;
      &lt;div id="kendoGridTest"&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
  function fnShowHide( iCol )
  {
     $('#kendoGridTest').data("kendoGrid").options.columns[iCol].hidden = false;
     $('#kendoGridTest').data("kendoGrid").refresh();
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>The MVC3-controller method returns data from search is of type JsonResult (given as <code>jsonResultSearchResult</code> below):    </p>
  
  <pre><code>$('#kendoGridTest').kendoGrid({
      dataSource: jsonResultSearchResult,
      schema: {
          model: {
              fields: {
                  FirstName: { type: "string" },
                  LastName: { type: "string" },
                  Address: { type: "string" }
              }
          }
      },
      sortable: true,
      resizable: true,
      columns: [{
          field: "FirstName",
          width: 90,
          title: "First name"
      },
          {
              field: "LastName",
              width: 120,
              hidden: true,
              title: "Last name"
          },
          {
              field: "Address",
              width: 140,
              title: "Adr"
          }
      ]
  });
  </code></pre>
  
  <p>After performing a search, the grid fills with the right data and <code>LastName</code> is indeed hidden. But if the user now checks the <code>checkShowField1</code> control, I would like the grid to refresh with all three cols visible. It does not. <code>fnShowHide()</code> does not do the job. </p>
  
  <p>I must admit I was looking for anything of a type of Columns collection in a QuickWatch window while debugging in VS. The collection in <code>fnShowHide</code> contains the right data from when the grid was initialized, and I'm able to manipulate the <code>.hidden</code> property, but the grid still does not display the column.</p>
  
  <p>I'm still a bit confused whether dynamic hide/show of cols <em>is</em> supported but <a href="https://stackoverflow.com/questions/11210989/kendo-ui-for-mvc-grid-how-do-i-hide-the-id-column">this accepted answer from a Telerik employee</a> looked promising.</p>