title: Kendo Grid MVC - Refreshing child / detail grid
body: <p>I'm using Kendo Grid with a master details setup. The details grid is named DetailsGrid_#=Id# so that it can access the id of the parent record - this part works fine.</p>
  
  <p>I have setup the details grid to update some part of the backing data and need to be able to refresh the details grid on the Success of a $ajax call. I try to select the details grid using :</p>
  
  <pre><code>var childGrid = $('#DetailsGrid_#=Id#').data("kendoGrid");
  childGrid.refresh();
  </code></pre>
  
  <p>But when I run this code I get a Jquery error saying "Uncaught Error: Syntax error, unrecognized expression: DetailsGrid_#=Id#"</p>
  
  <p>Can anyone suggest the correct way of selecting the details grid, or another way of calling the refresh? </p>
  
  <p>Update: Having done some further research on query selectors I see that I need to escape the = &amp; # characters. I've now modified the code as follows which gets past the "unrecognized expression" error, but I now get the error "Cannot call method 'refresh' of undefined " so the grid isn't being recognised </p>
  
  <pre><code>var param = "DetailsGrid_#=Id#";
                  var escapedParam = param.replace(/([ #;&amp;,.+*~\':"!^$[\]()=&gt;|\/@@])/g, '\\$1');
                  //function escape(param) {
                  //    return param.replace(/([ #;&amp;,.+*~\':"!^$[\]()=&gt;|\/@@])/g, '\\\\$1');
                  //}
                  var childGrid = $('#' + escapedParam ).data("kendoGrid");
                  childGrid.refresh();
  </code></pre>