Angular tree widget

[bobmazzoParticipant]

Hello Peter,
Is it at all possible to wire up a jqx tree widget with JSON ? I’ve attempted to create a jsfiddle here to at least demonstrate where I’m going with this:

http://jsfiddle.net/robertmazzo/2oo01a58/

In other words, I’m looking to create nested JSON and then bind it to the jqx tree (similar to the way the jqx TreeGrid works with nested JSON).

Thank you for your time.

regards,
Bob

[Peter StoevKeymaster]

Duplicate post: http://www.jqwidgets.com/community/topic/jqxtree/

[bobmazzoParticipant]

hi Peter,
I’m trying to get this jsfiddle to work the same as your demo, as well as another example using ng-repeat to create the ul list.
Can you please direct me as to where I’m going wrong here ? http://jsfiddle.net/robertmazzo/s9snLu9m/

thank you very much !

Bob

[bobmazzoParticipant]

Here, for example, if you comment out the ng-repeat line, and uncomment the hard-coded ul data – the tree render fine !
However, using ng-repeat for some reason renders an empty tree.

<jqx-tree jqx-width="'300px'" jqx-height="'300px'">
    <ul><li ng-repeat="kriGroup in vm.kriServerDataJson">{{kriGroup.group}}</ul>                                                    
    <!--<ul>
	    <li>99_HSVaR</li>
	    <li>Additive</li>
	    <li>AsianCrisis</li>
	    <li>Bump_FX_1bp</li>
	    <li>CDSStress A</li>
	    <li>CDSStress AA</li>
	    <li>CDSStress AAA</li>
	    <li>CDSStress BBB</li>
	    <li>CS01</li>
	    <li>CVaR</li>
	    <li>Counterparty Sensitivity</li>
	    <li>EUR_USD by EUR</li>
	    <li>EUR_USD by EUR Long</li>
	    <li>EUR_USD by EUR Short</li>
	    <li>EUR_USD by USD</li>
	    <li>EconomicCapital</li>
	    <li>ExpectedLoss</li>
	    <li>GBP_Non_Parallel</li>
	    <li>GREEKS</li>
	    <li>LTCM</li>
	    <li>MTM</li>
	    <li>PV01</li>
	    <li>RussianCrisis</li>
	    <li>Simulated</li>
	    <li>SimulatedGross</li>
	    <li>USD_Non_Parallel</li>
	    <li>Vega_1bp_1yr</li>
	    <li>Vega_1bp_EUR_USD</li>
    </ul>-->                                                    
</jqx-tree>

[Peter StoevKeymaster]

Hello bobmazzo,

The problem in your code is that your ng-repeat is in the scope of jqxTree, not in the scope of “myController”. Ex: http://jsfiddle.net/jqwidgets/5svyo7kt/

Best Regards,
Peter Stoev

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

[bobmazzoParticipant]

Thank you Peter !
And in addition, you added the jqx-data attribute, which I can’t find in any of your demos (although there’s the jqx-data-table under datatables demo).

Perhaps some more angular examples with these hidden gems can be added to your documentation. This will be extremely helpful to prospective buyers as myself.

best regards.

Bob

[Peter StoevKeymaster]

You must have missed it, because it is used in the demos. Ex: http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxangular/button.htm?arctic. So this is not a hidden setting. In addition, I checked that your 30-day evaluation has ended in July and to be more precise 19-July, so please expect answers in your future topics only from your Forum peers.

Best Regards,
Peter Stoev

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

[bobmazzoParticipant]

Also great news for others to read.
Using ng-if I’m able to nest the list as follows : http://jsfiddle.net/robertmazzo/4582335n/

<jqx-tree id="kriTree" jqx-data="vm.kriServerDataJson" jqx-width="'250px'" jqx-height="'500px'">
    <ul>
       <li ng-repeat="kriGroup in data">{{kriGroup.group}}
           <ul ng-if="kriGroup.kris">
               <li ng-repeat="kri in kriGroup.kris">{{kri.kri}}</li>
           </ul>
       </li>
    </ul>                                                                                                   
 </jqx-tree>      

[bobmazzoParticipant]

Yes, Peter. I do see the jqx-data attrib now in your button demo. Sorry, it was a bit hard to find, so thank you for pointing that out.

If you check your emails, you’ll see that I downloaded your jqw 3.5 angular release on Sept 24th. You even sent me a welcome email.

Perhaps you’re referring to my original download back in June, but I was never able to get one single widget to work in the Angular environment. And when I tried to post to your forums, I kept getting a “page not found” error. I had emailed regarding that error many times, but never got a response. It was only recently that I created a new user id (“bobmazzo”) in addition to my old one (“robertmazzo”), that I was finally able to get into the forums.

Anyhow, I hope you understand – and thank you again for your time.

best regards.
Bob

[Peter StoevKeymaster]

Hi Bob,

The fact that you contacted our support team several times back in June and we replied you and you downloaded jQWidgets in June means that your evaluation started in June. As our evaluation is 30 days, this means that now you are asking questions after your evaluation. That is why I wrote you to expect answers only from your Forum peers.

Best Regards,
Peter Stoev

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

[Author]

Posts