Integrating Alpha Anywhere with an Open Source jQuery Tree Control

Blog



Integrating Alpha Anywhere with an Open Source jQuery Tree Control


Standards-based RMAD

One of Alpha Anywhere's core strengths is its commitment to standards.

While Alpha Anywhere's RMAD (Rapid Mobile Application Development) capabilities automate programming tasks that are common but complex saving you development time, it is the opportunity to add custom standards-based code that gives you the confidence that you'll never run out of power to get the job done. HTML5, CSS JavaScript on the client- and server-side, .NET supported languages, SQL, NoSQL, Node.js, jQuery...the list goes on.

In the post below. independent Alpha Anywhere developer David Kates describes his experience working with a highly configurable open source jQuery Tree Control to extend his Alpha Anywhere applications. David is the owner of Adjustable Software, a consulting and development firm who specialize in Microsoft Access to Alpha Anywhere conversions, API integration, PayPal integration, jQuery & JavaScript plug-in integration, NFC tag scanning, and more.

Climbing Trees with Alpha Anywhere

jsTree is a very powerful, open source, jQuery Tree control and works beautifully with Alpha Anywhere. The node hierarchy in jsTree is fed with JSON which is easily created by an Alpha callback to a sql back end. The nodes sql table is a very simple 4 column table (in this case) which includes a node Id, a node ParentId, a description, and, optionally, an icon for the node.

The nodes selected per record are held in another table with 2 columns: RecordId and NodeId… which, in this case, is a Category Id.



Animation of the tree can be turned on or off, when the tree is rendered it can be collapsed, partially opened, or fully opened. As nodes are selected, if a parent node is in place that parent node is shaded to show an effect on that parent.

I’ve place an event on this tree which, on change of a node, will set the UX dirty. So, as nodes are selected or de-selected, the UX Submit button becomes active. When the UX record is submitted, a jsTree method returns all the selected nodes in a comma delimited string which is then sent off to a callback, processed, and written to a table.

As you navigate from record to record in the UX, a callback is made to get the nodes for that specific record and a jsTree method is then called updating the tree with those nodes.

Full drag and drop is supported and I’ll be looking at a mobile aspect regarding this in another video.

jsTree… very powerful, chock full of methods, events and features, and plays very well with Alpha Anywhere.
Brea


This post if part 1 of a 2 part series on integrating custom controls with Alpha Anywhere. Click here to read part 2.


Brea
RMAD tools jQuery, HTML5, JavaScript
Thinking about a career choice - some very compelling data supporting a development career.
Video: Alpha Anywhere Aces Offline Applications

About Author

Default Author Image
Chris Conroy

Chris Conroy runs digital programs for Alpha Software.

Related Posts
6 Reasons why Companies are looking to Build
6 Reasons why Companies are looking to Build "industrial Strength Mobile apps for their "Stand-Up" Staff
How OERCA Used Alpha Anywhere and Alpha TransForm to Build IoT-Powered Analytics Dashboards
How OERCA Used Alpha Anywhere and Alpha TransForm to Build IoT-Powered Analytics Dashboards
How Alpha Software Helped GBS Enterprises Increase Field Productivity by 80%
How Alpha Software Helped GBS Enterprises Increase Field Productivity by 80%

Comment

Subscribe To Blog

Subscribe to Email Updates