Xbasic

a5_sqlToJSONExpandingMenu Function

Syntax

a5_sqlToJSONExpandingMenu as c (connectionString as c, table as c, fieldList as c [, endpointFieldName as C [, filter as C [, order as C [, argsIn as SQL::Arguments [, endpointFunctionName as C]]]]])

Arguments

connectionStringCharacter

Connection string to the SQL database.

tableCharacter

The table in the SQL database.

fieldListCharacter

The comma-delimited list of fields from the table that defined the Expanding menu hierarchy. For example, if you specify country,city,contactname the Expanding Menu will show a list of countries. If you expand a country, you will see a list of cities in the selected country. If you expand a city you will see a list of contactnames in the selected city. If you click on a city, the endpointFunctionName will be called and the value of the endpointFieldName will be passed to the function.

endpointFieldNameCharacter

The name of the field whose value is passed to the endpointFunction.

filterCharacter

The filter to use for the SQL Select statement's WHERE clause. (The SQL Select statement is automatically generated from the function arguments.)

orderCharacter

The order to use for the SQL Select statement's ORDER BY clause.

argsInSQL::Arguments

Default = null_value(). A SQL::Arguments object that defines the arguments used in the filter. argsIn must be defined if the filter uses arguments.

endpointFunctionNameCharacter

The name of the Javascript function to call when the user clicks on an Expanding Menu leaf node. The function is called and the value of the data in the endpointFieldName is passed to the function. For example, using the Northwind Customer table. If the Expanding Menu shows country, city, contactname and the endpointFieldname is customerid, if the user expands the "USA" menu entry, then the "Seattle" menu entry, then clicks on the "Karl Jablonski" leaf entry, the endpointFunction is called and the value "WHITC" is passed to the function. "WHITC" is the value in the endpointFieldName for the record that was clicked.

Description

Generates JSON to populate an Expanding Menu control from a SQL query.

Discussion

The a5_sqlToJSONExpandingMenu() function generates the JSON needed to populate an Expanding Menu control in a UX component from data returned by a SQL query.

dim cs as c = "::name::AADemo-Northwind"
dim table as c = "customers"
dim fieldlist as c = "country,city,contactname"
dim endpointfield as c = "customerId"
dim filter as c = "country <> ''"
dim order as c = "country"
dim endpointfunctionname as c = "selectCustomer"

dim json as c
json = a5_sqlToJSONExpandingMenu(cs,table,fieldlist,endpointfield,filter,order,null_value(),endpointfunctionname)

'now use this JSON to generate the Javascript to populate an Expanding Menu control on a UX component

dim js as c
js = "var data = " + json + ";" + crlf()

js = js + <<%str%
var obj = {dialog.object}.getControl('expandingmenu_1');
obj.data.items = data.items
obj.data.actions = data.actions
obj.refresh()
%str%

Videos

Dynamically Populating an Expanding Menu with Ajax Callbacks

This video shows how you can dynamically populate an Expanding Menu control with data computed in an Ajax callback.

Download Component

2018-08-09

See Also