[bobmazzoParticipant]

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

[bobmazzoParticipant]

is there any chance that you could actually provide solid examples rather than just mention that you have documentation somewhere ? It’s too vague of an answer. I have yet to find one angular example implementing this method.

In addition, your previous thread states the correct way of calling it as follows:

‘$scope.settings.apply(‘updatebounddata’)’

My call is can initially be made as $scope.result.dataModel.treeGridOptions.apply("updateBoundData");

then my final attempt can be on the widget itself (i.e. I’m integrating a dashboard widget framework)
widget.dataModel.treeGridOptions.apply("updatebounddata"); but it doesn’t re-render the treegrid.

I’m using 3.5, by the way.

[bobmazzoParticipant]

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

[bobmazzoParticipant]

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

[bobmazzoParticipant]

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.

[bobmazzoParticipant]

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’]);

[bobmazzoParticipant]

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

[bobmazzoParticipant]

It turns out that this API Reference is what I was looking for, under the ‘getkey’ method: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxtreegrid/index.htm?%28arctic%29#demos/jqxtreegrid/defaultfunctionality.htm

And this jsfiddle shows how to getrows and getkey: http://jsfiddle.net/jqwidgets/S3q9c/

In a custom Angular directive, I used these 3 lines of code so the treeview would auto-expand :

`var rows = $(“#treeGrid”).jqxTreeGrid(‘getRows’);
var key = $(“#treeGrid”).jqxTreeGrid(‘getKey’, rows[0]);
$(“#treeGrid”).jqxTreeGrid(‘expandRow’, key);`

I hope this is helpful to someone.

[bobmazzoParticipant]

Mike,
Have you found any docs on the jqx-data directive ? I only find one minor example under the “button” example here: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxangular/index.htm?%28arctic%29#demos/jqxangular/button.htm

[bobmazzoParticipant]

Hi Mike,
Not in production in my case. Only in a beta.
The treegrid is working great.
My only issue right now is the charts. They look great on my test page, but something in Angular is throwing an exception when I navigate away from my page where the chart is rendered. The angular destroy() method crashes on jqx-core; and trying to reproduce this (for support) in jsfiddle or plunker online is very difficult (see my post under angular this forum).

What’s your issue ? Have you read through the Ang online samples and getting started docs ?

regards,
Bob

[bobmazzoParticipant]

Tty,
Feel free to get in touch and perhaps we can share ideas ( robertmazzo@yahoo.com ). I’d like to get the jq-chart working flawlessly.
– Bob

[bobmazzoParticipant]

Hello Peter,
Your responses are a bit generic here. Any specific advice, or perhaps jsfiddle chart samples with Angular integration ?
thanks,
Bob

[bobmazzoParticipant]

Tyl – I’m struggling to get my sample working properly in jsfiddle. I had a chart rendered at one point, but now it doesn’t. So I’ll have to revisit that.

Can you elaborate on your exact problem, Tyl ? The steps to reproduce the issue ?

[bobmazzoParticipant]

I understand it’s difficult to debug, but what I don’t understand is why it’s complaining about jqxCore when Angular tries to run the destroy method.
It appears to be somewhat complicated to reproduce my project environment in jsfiddle, but I will give it a try.
In the meantime, are there additional angular/jqx-chart examples other than the basic ones here ? http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxangular/index.htm?%28arctic%29#demos/jqxangular/chart.htm

[bobmazzoParticipant]

I have the jsfiddle working with the jqx-chart here: http://jsfiddle.net/jqwidgets/sEejs/

I will try to add the Bootstrap menu in order to reproduce the exception.

I will also attach a couple of screen shots, and would appreciate if you could have a look at where it crashes in AngularJs on the jqx-core.

NOTE: The jqx-tree-grid working fine. No issues there.

[Author]

Posts