jQuery UI Widgets Forums Plugins AngularJS Refresh Grid

This topic contains 12 replies, has 4 voices, and was last updated by  bobmazzo 5 years, 5 months ago.

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Refresh Grid Posts
  • Refresh Grid #65098

    Freak
    Participant

    Hello team,

    I am binding a grid using JSON data and after updating the data in the grid, I want to refresh the grid. Is their any method like updatebounddata to refresh grid? And one more thing, when the grid is loading their is no ‘loading’ spinner displayed. How can I fix this?

    Thanks,
    Freak

    • This topic was modified 5 years, 6 months ago by  Freak.
    Refresh Grid #65116

    Dimitar
    Participant

    Hello Freak,

    There is a method called updatebounddata in jqxGrid’s API which updates the bound data and refreshes the grid.

    As for the “loading” element, if your data is not very large, the grid may be loading too quickly for it to display. You may programmatically call showloadelement to display it if you wish.

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Refresh Grid #65121

    Freak
    Participant

    Hi,

    I am calling updatebounddata as $scope.settings.apply(‘updatebounddata’) but the grid data is not updated. Can you provide API reference for angualr js?

    Thanks,
    Freak

    Refresh Grid #65174

    Dimitar
    Participant

    Hi Freak,

    You are correctly calling the grid method in the Angular environment. For more options, please refer to the help topic jQWidgets Integration with AngularJS, section Invoking Methods.

    Please make sure that you actually need the updatebounddata method – it is useful when the data source has been updated and you wish the grid to reflect those changes. Is this what you require?

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/

    Refresh Grid #66949

    bobmazzo
    Participant

    I have the same situation as Freak. Specifically in my case, the init grid rendering is fine because it’s first binding hard-coded json data. No problem here.
    Then, I present a modal window for the user to make some data parameter selections, after which I submit to the server. The server returns the required data, and I parse it accordingly prior to binding it back to the treegrid’s datasource.
    ex/ after data comes back from server…

    `var myModel = $rootScope.reptGrid.modelDef;
    myModel[“localData”] = $rootScope.reptGrid.aggrResults;
    var dataAdapter = new $.jqx.dataAdapter(myModel);

    $scope.result.dataModel.treeGridOptions.source = dataAdapter;
    $scope.result.dataModel.treeGridOptions.columns = colDefs;

    $modalInstance.close($scope.result);`

    Once I return to the main directive, I make an attempt to call the jqw apply() method :

    `modalInstance.result.then(
    function (result) {
    widget.dataModel.widgetScope.treeGridOptions.apply();
    //widget.dataModel.widgetScope.treeGridOptions.source.dataBind(); // ALSO TRIED THIS, BUT IT DOES NOT WORK
    }
    );`

    I’ve combed through your docs but I still can’t get it to work.

    I’ve even tried to download 3.7 from your download page, but the jqx treegrid crashes angular left and right !

    Your advice is greatly appreciated guys….

    regards,
    Bob

    • This reply was modified 5 years, 5 months ago by  bobmazzo.
    Refresh Grid #66958

    Peter Stoev
    Keymaster

    Hi Bob,

    You can send us jsfiddle.net sample if you experience issues. treeGrid.source.dataBind will not work because the source does not have method called dataBind. widget.dataModel.widgetScope.treeGridOptions.apply() – there is also no such thing. “apply” if options are defined expects method name and method parameters. No issue with TreeGrid in AngularJS – http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxangular/treegrid.htm?arctic

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    Refresh Grid #67017

    bobmazzo
    Participant

    Hi Peter,
    I’m experiencing an issue only trying to rebind an updated data source to the treegrid. In other words, the initial rendering if fine; however, after making a round trip to the server for new data, I would like to re-render the treegrid with the updated data. Can you provide specific advice ?

    further details:

    If I set a breakpoint in the front end, I can view the “source” object which contains the dataAdapter :

    widget.dataModel.widgetScope.treeGridOptions.source
    i.jqx.dataAdapter {_source: Object, _options: Object, records: Array[0], _downloadComplete: Array[0], _bindingUpdate: Array[0]…}_

    So I was looking for a way to “rebind” the data to the treegrid, and I do in fact see a “databind” object. However, it does nothing.

    Your own documentation says that the settings object is extended with refresh and apply methods (see http://www.jqwidgets.com/jquery-widgets-documentation/documentation/angularjs/angularjs.htm); however I now see that it does need specific parameters.

    So on my treegrid I have:

    <div id=”treeGrid” jqx-tree-grid jqx-instance=”treegrid” jqx-settings=”treeGridOptions”></div>

    then in my controller I assign the dataAdapter and the column definitions like this :

    $scope.result.dataModel.treeGridOptions.source = dataAdapter;
    $scope.result.dataModel.treeGridOptions.columns = colDefs;

    so I was expecting to have access to the refresh method (i.e. `$scope.result.dataModel.treeGridOptions.refresh([‘width’, ‘height’])’ )

    Am I using in the wrong way?

    I was following your jqx-combo-box example at the link I posted :

    $scope.comboBoxSettings.refresh([‘width’, ‘height’]);

    • This reply was modified 5 years, 5 months ago by  bobmazzo.
    • This reply was modified 5 years, 5 months ago by  bobmazzo.
    • This reply was modified 5 years, 5 months ago by  bobmazzo.
    Refresh Grid #67022

    bobmazzo
    Participant

    I’ve set up a jsfiddle based on your demo, but having trouble getting it running.

    http://jsfiddle.net/robertmazzo/41meqkeg/

    Your help is appreciated.

    Refresh Grid #67026

    Peter Stoev
    Keymaster

    Hi bobmazzo,

    How is this sample different from our online and working one: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxangular/treegrid.htm?arctic
    I wrote you about “apply” and “dataBind”. I did not wrote you about “refresh”. “refresh” refreshes property values, not the widget itself. jqxTreeGrid has “updateBoundData” method – it’s used for re-binding it using the same data source. If you want to set new source, you should set its “source” property to a new data source.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    Refresh Grid #67034

    bobmazzo
    Participant

    Hi Peter,
    I would like to know if you have your demos in a jsfiddle state ready to go. I’ve tried to copy your demo code into a new jsfiddle, but can’t get it working.

    And with regards to refresh(), I thought that it would re-render the widget based on this statement in your docs. Please excuse me if I misunderstand certain things in the docs :

    The purpose of the "refresh" method is to refresh the widget manually after you changed values in the settings object. Invoking "refresh" without arguments will update all widget settings...

    I’ll try the updateBoundData method instead.

    thanks,
    Bob

    • This reply was modified 5 years, 5 months ago by  bobmazzo.
    • This reply was modified 5 years, 5 months ago by  bobmazzo.
    Refresh Grid #67113

    bobmazzo
    Participant

    Hi Peter,
    I found this jsfiddle by way of the api page:

    I’d like to now implement this in the angular version: $("#treeGrid").jqxTreeGrid('updateBoundData'); but it just returns undefined in my own code.

    Can you help me with that ? Any online angular based samples you can point me to ?

    thx,
    Bob

    • This reply was modified 5 years, 5 months ago by  bobmazzo.
    Refresh Grid #67133

    Peter Stoev
    Keymaster

    Hi Bob,

    We have many online AngularJS Examples – http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxangular/index.htm

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    Refresh Grid #67272

    bobmazzo
    Participant

    Hi Freak,
    How did it go with that refresh ? Did the apply method work for you ?

Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in to reply to this topic.