Reloading Infragistics grid

Question

I have an Infragistics grid that I need to reload via Jquery. They currently have a bug when updating/inserting rows with a value/text drop down in the grid so I need to manually reload it.

$("#grid1").igGrid("databind"); does not work. How do I reload the whole grid via Jquery?

What do you mean by calling dataBind does not work? Does the grid not rebind? — Konstantin Dinev, Nov 14 '12 at 11:51
If you have logged a development issue about this, can you please let us know of the case ID number or the internal bug ID (I'm from Infragistics)? Also, I'm afraid that the details you've supplied are too few to give you a sensible suggestion. Calling the "dataBind" API method is the way to go so unless you provide some more details about your scenario and/or the error (if any) you're getting, it will be very hard to give you an answer/solution. — Borislav T, Nov 14 '12 at 13:45

score 4 · Answer 1 · answered Apr 01 '14 at 15:04

4

You need to call the method "dataBind" (is just a Typo)

$("#grid1").igGrid("dataBind");

Hope this helps some one at least :)

answered Apr 01 '14 at 15:04

Eduardo Crimi

1,551
13
13

score 0 · Answer 2 · answered Aug 26 '13 at 13:39

If you want to reload the whole grid you can always try using an UpdatePanel and setting the trigger to be the RowUpdated and RowAdded events; You just have to rebind the grid to the datasource from the event handler. I figure you can get that done with the client events and jQuery, but I've only tried this rebinding from the code behind.

Good Luck

score 0 · Answer 3 · answered Jun 04 '14 at 10:49

They have not given any method that can help but you can try out below code that works great.

Here first time igGrid load on DOM and second onwards load after calling igGridUpdate(), that wroks really great. I have used data from my application URL which gives me json data you pass directly data source.

  $(document).ready(function() {
    var data  = "/orders/open_orders.json";
    igGridLoading(data);

  });


  function igGridUpdate()
  {


    $.ajax( {
     type : 'GET',
     url : '/orders/open_orders.json',
     dataType : 'json',
     success : function(data) {
          igGridLoading (data);
     },

  error: function(XMLHttpRequest, testStatus, errorThrown) {
     alert('Error!');
   }

   });

}

 function igGridLoading(data)
  {
        $("#open_order_list").igGrid({
          columns: [
              { headerText: "Order ID", key: "id", dataType: "string", hidden:true },
              { headerText: "Order no", key: "order_number", dataType: "number" },
              { headerText: "Customer name", key: "customer_name", dataType: "string", align: "center" }, 
              { headerText: "Reseller name", key: "reseller_name", dataType: "string" },
              { headerText: "Created date", key: "created_at", dataType: "date" },
              { headerText: "Time", key: "created_time", dataType: "string" },
              { headerText: "Updated date", key: "updated_at", dataType: "date" },
              { headerText: "Time", key: "updated_time", dataType: "string" },
              { headerText: "Order status", key: "order_status_name", dataType: "string" },
              { headerText: "Updated by", key: "updated_by", dataType: "string" }
          ],
          dataSourceType: 'json',
          dataSourceUrl: "/orders/open_orders_grid",
          dataSource: data,
          primaryKey: "id",
          autoGenerateColumns: false,
          width: "900px",
          responseDataKey: "results",

              features: [
              {
                  name: "Tooltips",
                  style: Modernizr.touch ? "popover" : "tooltip",
                  visibility: "always"
              },
              {
                  name: 'Paging',
                  type: "local",
                  pageSize: 10
              },
              {
                  name: "Filtering",
                  type: "local",
                  mode: "advanced",
                  filterDialogContainment: "window"
              },
              {
                  name: "Resizing"
              },
              {
                  name: "Selection",
                  mode: 'row',
                  multipleSelection: true
              },
              {
                  name: "Sorting",
                  type: "local",
                  mode: "multi",
                  sortingDialogContainment: "window"
              },
              {
                  name: "Hiding"
              },
              {
                  name: "ColumnMoving",
                  columnMovingDialogContainment: "window"
              }
          ]
    });
  }

Let me know If you need any help

Reloading Infragistics grid

3 Answers3

Linked