RDLMX - Java Script and Dropdowns

[Dennis.Reynolds]

Really new to LongRange.

I'm reading a barcode and using Java Script to parse the barcode into three fields. That part is working farely well. Two of the fields appear where I want them to on the form. What is giving me a problem is trying to return a field to the form that is also a dropdown. This dropdown is populated by a file stored on the device so that it can be used offline. I know the field in question is working, I can display it in a different field, just can not get it to appear in the dropdown as the selected row.

[Mark_Dale]

Would it be possible to get a simple but concrete example? Then we could try it out and see where its going wrong.

[Dennis.Reynolds]

Thanks, I've tried to strip everything out of the program that doesn't apply to the dropdown or java script. Hope this isn't too confusing.

Function Options(*DIRECT)
Begin_Com Role(*EXTENDS #LRNG_FORM)

* ===============================================================
* DLR_PKUP3 - Hauler Mobile Pickup Add Screen.
* 08/13/14 - dlr
* ===============================================================
Define Field(#Value) Type(*STRING)
Define Field(#Counter) Type(*INT)
Define Field(#LastEntry) Type(*int)
Define Field(#uText) Type(*string)

Define Field(#CValue) Type(*char) Length(5)
Define Field(#CText) Type(*char) Length(30)
Define Field(#uEntry) Type(*INT)
Define Field(#uSTAMP) Type(*char) Length(26)

Define_Com Class(#std_int) Name(#uBeepOnScan)
Define_Com Class(#prim_alph) Name(#uBeepOnScanC)

Define_Com Class(#std_int) Name(#uVibeOnScan)
Define_Com Class(#prim_alph) Name(#uVibeOnScanC)

Define_Com Class(#Prim_Alph) Name(#PKUPSNA)

Define Field(#uFRMID) Reffld(#frmid)


Mthroutine Name(HandleRequest) Options(*REDEFINE)
* Define_Com Class(#prim_alph) Name(#Value1)
* Define_Com Class(#prim_alph) Name(#Value2)

* -----------------------------------------
* Handle currently requested action
* -----------------------------------------

* Always set the USING Element to /Form.Fields at the start
#Com_Owner.Using Element('/Form.Fields')

* Get the Beep intensity
#com_owner.Get_dropdown Name(BEEPINTENSITY) Value(#uBeepOnScanC)
#uBeepOnScan := #uBeepOnScanC.AsNumber

* Get the Vibrate intensity
#com_owner.Get_dropdown Name(VIBEINTENSITY) Value(#uVibeOnScanC)
#uVibeOnScan := #uVibeOnScanC.AsNumber


Case Of_Field(#COM_OWNER.RequestACTION)

When (= SHOWVALUES) /* The 'Submit' command has been touched */
#COM_OWNER.IsNewForm := False

When Value_Is('= DEFAULT')
#COM_OWNER.uDrawForm
Otherwise
Execute Subroutine(Hand_Req)
Endcase
#COM_OWNER.Set_Form Grid_Col_N(2) Grid_Col_Width(Fill)
* Barcode
* #COM_OWNER.Set_Label Layout_Row(4) Layout_Col(1) Text('Single')
#Com_Owner.Set_Barcode Layout_Col(2) Layout_Row(4) Multipleentries(False) Name(SINGLE_BARCODE) Scanner_Code39(True) Scanner_Qrcode(True) Scanner_Upca(True) Scanner_Code128(True) Scanner_Itf(True)

* There is a trick with barcodes - their properties cannot be mapped to a VAR or GVAR
* So instead, call a script when the scan is complete, and in the script get the barcode value and count
#Com_Owner.Set_Op_ExecScript Event(SINGLE_BARCODE.Onscancomplete) Resource(HMD_PKUP3.js)

#COM_OWNER.Set_Label Name(OUTPUT_VALUE) Layout_Row(31) Layout_Col(2) Layout_Cols(-1) Text(' ')

Endroutine

Mthroutine Name(uDrawForm)
* Initialize grid
#COM_OWNER.uInitRowCol
* Logo

* Bind Farm data to form
#Com_Owner.Set_Binding Name('/Form') Bindtotype(TBL) Bindto('FARM')
#Com_Owner.Set_Binding Name('/Form') Bindtotype(SQL) Bindto('SELECT ROWID, FRMID, FRMNAM, FGRDGR, FTNKNO, IMSSNM FROM FARM WHERE FRMID = &(VAR:DLR_PKUP3_FRMID)')

* Barcode
#COM_OWNER.Set_Label Layout_Row(3) Layout_Col(2) Text('Scan Barcode')

#COM_OWNER.Set_Label Layout_Row(5) Layout_Col(2) Text(Or) Textalign('center')

* ============================================
* Farm dropdown
* ============================================
* farm
#COM_OWNER.Set_Label Text('Farms') Layout_Row(6) Layout_Col(2)
#COM_OWNER.Set_Dropdown Name(FarmDD) Value(' ') Layout_Row(7) Layout_Col(2)

* To bind a drop down to an SQL statement you need to use the .ItemTemplate and .ItemList properties
#Com_Owner.Set_Binding Name('FarmDD.ItemTemplate') Property(Value) Bindtotype(FLD) Bindto('FRMID')
#Com_Owner.Set_Binding Name('FarmDD') Property(ItemList) Bindtotype(SQL) Bindto('SELECT ROWID, FRMID, FRMNAM, FGRDGR, FTNKNO, IMSSNM FROM FARM')
* Bind the drop down result value to a GVAR variable that can be referenced by SQL statements
#com_owner.set_binding Name('FarmDD') Property(Value) Bindtotype(VAR) Bindto('DLR_PKUP3_FRMID')

* Make a value change on the dropdown cause the form to be refreshed and the textboxes reflect the details for the selected value.
#COM_OWNER.Set_Op_Form_Refresh Event(FarmDD.OnValueChange)

* ============================================

* Tank
#COM_OWNER.Set_Label Text('Tank') Layout_Row(8) Layout_Col(2)
#COM_OWNER.Set_Dropdown Name(DDown2) Value(' ') Layout_Row(9) Layout_Col(2)
#COM_OWNER.Set_Dropdown Name('DDown2') Item_N(1) Item_Text('1') Item_Value('1')
#COM_OWNER.Set_Dropdown Name('DDown2') Item_N(2) Item_Text('2') Item_Value('2')
#COM_OWNER.Set_Dropdown Name('DDown2') Item_N(3) Item_Text('3') Item_Value('3')

* Sequence
#COM_OWNER.Set_Label Text('Sequence') Layout_Row(10) Layout_Col(2)
#COM_OWNER.Set_TextBox Layout_Col(2) Layout_Row(11) Name('PKUPSN') Placeholder('Seq No') Datatype('Number')

Endroutine

* Initializes LongRange grid
Mthroutine Name(uInitRowCol)
#COM_OWNER.Set_Form Grid_Row_N(12) Grid_Row_Height(25)

#COM_OWNER.Set_Form Grid_Col_N(1) Grid_Col_Width(30)
#COM_OWNER.Set_Form Grid_Col_N(2) Grid_Col_Width(FILL)
#COM_OWNER.Set_Form Grid_Col_N(3) Grid_Col_Width(30)
Endroutine

Subroutine Name(Hand_Req)
#uBeepOnScanC := '2'
#uBeepOnScan := 2
#com_Owner.Set_Dropdown Name(BEEPINTENSITY) Value(#uBeepOnScanC)
#uVibeOnScanC := '0'
#uVibeOnScan := 0
#com_Owner.Set_Dropdown Name(VIBEINTENSITY) Value(#uVibeOnScanC)

#uSTAMP := '200510111252am'

Endroutine

End_Com


The java script is:

/* These files should be saved as UTF-8 */

var myBarcode = "";
var JSFRMID = "";
var SEQN = "";
var TANKID = "";

lrexec(
/* These functions execute as a chain - Each receives a value from the previous function */
/* Whenever you want to use a value from a form element, you have to queue the request to get it, */
/* and receive its value in the next function */

function()
{
/* This is optional, for debugging. You can view these messages by activating the developer console on the device */
/* Under Settings --> Development --> Developer Console */
this.console("HMD_PKUP3.js started - using version 1");

/* Queue a request to get the barcode value which will be received by the next function */
this.q_getProperty("Form.Fields.SINGLE_BARCODE.Value");
},

function(value1)
{
/* Store the value received from the previous function */
myBarcode = value1;


/* Queue a request to get the barcode count which will be received by the next function */
/*this.q_getProperty("Form.Fields.SINGLE_BARCODE.Value.Count"); */
JSFRMID = myBarcode.substring(2, 8);
TANKID = myBarcode.substring(8, 9);
SEQN = myBarcode.substring(9);
this.q_setProperty("Form.Fields.FarmDD.Value", JSFRMID );
},


function()
{
this.q_setProperty("Form.Fields.DDown2.Value", TANKID );

},


function()
{
this.q_setProperty("Form.Fields.PKUPSN.Value", SEQN );

},
/* End marker */
null
);

[Mark_Dale]

ok, thanks - I'll have a look at it later this week.

[Mark_Dale]

I think I can get it to work.

I have an SQL Table FARM,
Fields FARMID FARMNAME
Data is:
'1' 'Farm 1'
'2' 'Farm 2'
'3' 'Farm 3'

I created a version of your program called TST_Z481. Its attached to the schema as a Local (/Offline) form view.


Function Options(*DIRECT)
begin_com role(*EXTENDS #LRNG_FORM)

Define Field(#Value) Type(*STRING)
Define Field(#Counter) Type(*INT)
Define Field(#LastEntry) Type(*int)
Define Field(#uText) Type(*string)
Define Field(#uEntry) Type(*INT)
Define Field(#uSTAMP) Type(*char) Length(26)

define_com class(#Prim_Alph) name(#PKUPSNA)

Mthroutine Name(HandleRequest) Options(*REDEFINE)

* -----------------------------------------
* Handle currently requested action
* -----------------------------------------

* Always set the USING Element to /Form.Fields at the start
#Com_Owner.Using Element('/Form.Fields')


Case Of_Field(#COM_OWNER.RequestACTION)

* This is a special Offline form.
* The request action is only ever &TEMPLATE
* It is run one time on the server by the schema to produce a form template which
* is imbedded in the schema and sent to the client.

* The client device can then use this form template without connecting to the server.
* This function cannot loop in the normal manner. It can only run once, and then will be static until the client refreshes their schema.
* The user can, however, access and update data on the SQL Lite Database on the Client, using this form

Otherwise /* Default */

Endcase


* Initialize grid

#COM_OWNER.Set_Form Grid_Col_N(1) Grid_Col_Width(30)
#COM_OWNER.Set_Form Grid_Col_N(2) Grid_Col_Width(FILL)
#COM_OWNER.Set_Form Grid_Col_N(3) Grid_Col_Width(30)

#COM_OWNER.Set_Form Grid_Row_N(12) Grid_Row_Height(25)


* Barcode
#COM_OWNER.Set_Label Layout_Row(3) Layout_Col(2) Text('Scan Barcode')
#COM_OWNER.Set_Label Layout_Row(5) Layout_Col(2) Text(Or) Textalign('center')

#Com_Owner.Set_Barcode Layout_Col(2) Layout_Row(4) Multipleentries(False) Name(SINGLE_BARCODE) Scanner_Code39(True) Scanner_Qrcode(True) Scanner_Upca(True) Scanner_Code128(True) Scanner_Itf(True)

* There is a trick with barcodes - their properties cannot be mapped to a VAR or GVAR
* So instead, call a script when the scan is complete, and in the script get the barcode value and count
#Com_Owner.Set_Op_ExecScript Event(SINGLE_BARCODE.Onscancomplete) Resource(TST_Z481.js)

* Farm dropdown

#COM_OWNER.Set_Label Text('Farms') Layout_Row(6) Layout_Col(2)
#COM_OWNER.Set_Dropdown Name(FarmDD) Value(' ') Layout_Row(7) Layout_Col(2)

* These could be added by selecting data from a database file on the server
* #COM_OWNER.Set_Dropdown Name(FarmDD) Item_N(1) Item_Text('Farm 1') Item_Value('1')
* #COM_OWNER.Set_Dropdown Name(FarmDD) Item_N(2) Item_Text('Farm 2') Item_Value('2')
* #COM_OWNER.Set_Dropdown Name(FarmDD) Item_N(3) Item_Text('Farm 3') Item_Value('3')

* To bind a drop down to an SQL statement you need to use the .ItemTemplate and .ItemList properties

#Com_Owner.Set_Binding Name('FarmDD.ItemTemplate') Property(Text) Bindtotype(FLD) Bindto('FARMNAME')
#Com_Owner.Set_Binding Name('FarmDD.ItemTemplate') Property(Value) Bindtotype(FLD) Bindto('FARMID')
#Com_Owner.Set_Binding Name('FarmDD') Property(ItemList) Bindtotype(SQL) Bindto('SELECT ROWID, FARMID, FARMNAME FROM FARM')


* Don't do this:
* Bind the drop down result value to a GVAR variable that can be referenced by SQL statements
* #Com_Owner.Set_Binding Name('FarmDD') Property(VALUE) Bindtotype(GVAR) Bindto('TST_Z481_FARMID')




* Tank
#COM_OWNER.Set_Label Text('Tank') Layout_Row(8) Layout_Col(2)
#COM_OWNER.Set_Dropdown Name(DDown2) Value(' ') Layout_Row(9) Layout_Col(2)
#COM_OWNER.Set_Dropdown Name('DDown2') Item_N(1) Item_Text('1') Item_Value('1')
#COM_OWNER.Set_Dropdown Name('DDown2') Item_N(2) Item_Text('2') Item_Value('2')
#COM_OWNER.Set_Dropdown Name('DDown2') Item_N(3) Item_Text('3') Item_Value('3')

* Sequence
#COM_OWNER.Set_Label Text('Sequence') Layout_Row(10) Layout_Col(2)
#COM_OWNER.Set_TextBox Layout_Col(2) Layout_Row(11) Name('PKUPSN') Placeholder('Seq No') Datatype('Number')

#COM_OWNER.Set_Label Name(OUTPUT_VALUE) Layout_Row(31) Layout_Col(2) Layout_Cols(-1) Text(' ')

Endroutine
End_Com


The javascript TST_Z481.js that it refers to is similar to yours (except I cheated slighty and hard coded the Farm ID to '1')

/* These files should be saved as UTF-8 */

var myBarcode = "";
var JSFRMID = "";
var SEQN = "";
var TANKID = "";

lrexec(
/* These functions execute as a chain - Each receives a value from the previous function */
/* Whenever you want to use a value from a form element, you have to queue the request to get it, */
/* and receive its value in the next function */

function()
{
/* This is optional, for debugging. You can view these messages by activating the developer console on the device */
/* Under Settings --> Development --> Developer Console */
this.console("TST_Z481.js started - using version 1");

/* Queue a request to get the barcode value which will be received by the next function */
this.q_getProperty("Form.Fields.SINGLE_BARCODE.Value");
},

function(value1)
{
/* Store the value received from the previous function */
myBarcode = value1;


/* Queue a request to get the barcode count which will be received by the next function */
/*this.q_getProperty("Form.Fields.SINGLE_BARCODE.Value.Count"); */
JSFRMID = '1';
TANKID = '2';
SEQN = myBarcode.substring(9);

this.console("setting property JSFRMID " + JSFRMID);

this.q_setProperty("Form.Fields.FarmDD.Value", JSFRMID );
},


function()
{

this.console("setting property TANKID " + TANKID);

this.q_setProperty("Form.Fields.DDown2.Value", TANKID );

},


function()
{

this.console("setting property SEQN " + SEQN);

this.q_setProperty("Form.Fields.PKUPSN.Value", SEQN );

},

/* End marker */
null
);

I set it all up, and refreshed the schema, and the dropdown seems to respond to the barcode scan.

[Dennis.Reynolds]

Mark, thanks for looking at this.

I'm still not getting the farm dropdown populated with a value from the java script. I created a new reusable part with your code, changing the js name and a couple of field names to match my file and I get the tank and seq numbers returned from the js, but not the frmid. The drop down is full of the farms I would expect to see based on the file on the device, but the value doesn't show up from the js. I did add an additional field to the form and have the js return an addtional value for the frmid and it is populated, so I know the value is being correctly parsed and returned, it just doesn't show up on the dropdown field.

[Mark_Dale]

Hi Dennis,

But, how can this be? My example has the famous "Works on my PC (ipad really)" seal of approval.

Lets see - the difference could be due to a number of things.

1. It could be some horrible subtle difference between devices and OS versions and Longrange versions.

I'm using
(Apple)
iPad3,
iOS 7.1.2
Longrange version on Device RV16 (build 1.0.6.858 - probably slightly later than yours)

What are your equivalent values?

2. It could be that one of us is not running the javascript we think we are running. If I activate developer console (under Miscellaneous Settings --> Development), and run the example, and touch the developer console button, I can check that all messages are green and TST_Z481.js is actually running and setting the values.

3. Just double checking, but you did leave the FarmDD.value property unbound in the RDMLX? (the line was commented out). If it is bound to something it does stop the example from working.

Regards
Mark Dale

[Mark_Dale]

Screenshot of before and after attached

Before and After

Before and after screen shot.PNG (24.47 KiB) Viewed 8160 times

[Dennis.Reynolds]

Mark, I think we figured it out. I've been working with Siyaman on this. One issue was in loading the dropdown from a file rather than just hard coding the drop down. That was actually working on a differrent drop down. The bigger issue was the Actual farm id field. It is numeric and the dropdown would show it as 10083 while the js would return 010083 and not find a match. Siyaman fixed the js to handle this properly and now it works.

Thanks for the help! Sorry to make this so confusing.