title: How to force a refresh on a Kendo UI Grid filled with remote data?
body: <p>I have a Kendo UI Grid filled with info from a remote source and I want to force a refresh on the information displayed after a Kendo UI Window on my website is closed.</p>
  
  <p>I tried this:</p>
  
  <pre><code>var grid = $("#usuariosGrid").data("kendoGrid");
  grid.refresh();
  </code></pre>
  
  <p>But it didn't work, this is how I create the Kendo UI Grid:</p>
  
  <pre><code>var ds = new kendo.data.DataSource({
      transport: {
          read: {
              url: root_url + "/usuario/index",
              dataType: "json"
          }
      },
      schema: {
          data: "Response",
          total: "Count"
      },
      serverPaging: false,
      pageSize: 2
  });
  $("#usuariosGrid").kendoGrid({
      pageable: {
          refresh: true
      },
      columns: [
          { field: "UsuarioId", title: "ID", width: "100px" },
          { field: "Nombre", title: "Nombre", width: "100px" },
          { field: "ApellidoP", title: "Apellido Paterno", width: "100px" },
          { field: "ApellidoM", title: "Apellido Materno", width: "100px" },
          { command: [{  text: "Editar", click: editFunction }, { text: "Eliminar", click: deleteFunction }], title: " ", width: "200px" }
      ],
      dataSource: ds
  });
  </code></pre>
  
  <p>I looked at the documentation but didn't come across a method to do this.</p>
  
  <p>On a side note, I've been wondering how to display a loading animation on the Kendo UI Grid while the data is being loaded into it, it is shown after it's been loaded and I'm clicking through the pages of the grid, but when there's no data, it looks collapsed and I would like to display a loading animation to make it look filled while the info is being loaded.</p>