Update a Select Object on GUI

Questions related to customising nuBuilder Forte with Javascript or PHP.

Update a Select Object on GUI

Postby fpdragon » Thu Jul 11, 2019 6:27 pm

I'm using the following php code from the tutorial in many cases. It is executed in the PHP "After Browse" section of a Lookup object.

Code: Select all
nuSetFormValue('dpl_prj_dml_items',nuLookupRecord()->dpl_catl_dml_items);


This works really good for all types of text fields and number fields.

However no I wanted to use a Select object with multiselect enabled and do the same thing as above.

The select seems to save the data textual in SQL in the following structure:
Code: Select all
["val1","val2" ... ]


That's ok but it seems that this structure can't be applied to the nuSetFormValue function. The Select GUI object stays the same and the selected values are always cleared.
Is there a way to use the string from the SQL to update the MultiSelect GUI object?
I guess there must be a function because the system has to convert the string representation and apply it to the GUI element when the edit view is loaded.

thx.
fpdragon
 
Posts: 38
Joined: Wed May 29, 2019 10:20 pm

Re: Update a Select Object on GUI

Postby fpdragon » Fri Jul 12, 2019 5:04 pm

I found a work around solution:

1.)
Create a second field that is used as a helper only. This is needed because nubuilder does not allow to have two edit fields that are linked to the same column and have the same ID.
I added dpl_prj_dml_items_select.

2.)
Create a hidden textfield for the real value
eg: dpl_prj_dml_items
Create a visible select that shall be synced with the textfield value and is linked to the newly created DB column.
eg: dpl_prj_dml_items_select

3.)
Add this code to the form's javascript section:
Code: Select all
$('#dpl_prj_dml_items_select').val(JSON.parse($('#dpl_prj_dml_items').val()));

This updates the select on item load.

4.)
Add this code to the Lookup object's javascript section:
Code: Select all
$('#dpl_prj_dml_items_select').val(JSON.parse($('#dpl_prj_dml_items').val()));

The lookup shall update the value of dpl_prj_dml_items in the After Browse PHP code and afterwards the dpl_prj_dml_items_select is updated with js.

5.)
In dpl_prj_dml_items_select add the following custom code:
onchange
Code: Select all
$('#dpl_prj_dml_items').val('[\"'+$('#dpl_prj_dml_items_select').val().join('\",\"')+'\"]');$('#dpl_prj_dml_items').trigger("change");

This converts back to a string and sets the hidden dpl_prj_dml_items when the select was changed and clicked.
I currently haven't found a more elegant solution without this string handling but it works well.

6.) (optional)
It seems that the SQL DB column can be removed again. The data itself is redundant and has no value.
fpdragon
 
Posts: 38
Joined: Wed May 29, 2019 10:20 pm

Re: Update a Select Object on GUI

Postby admin » Sat Jul 13, 2019 11:33 am

fpdragon,

Your hidden Object doesn't need to be a real field name it could be called bob.

So...
Your PHP could be
Code: Select all
nuSetFormValue('bob',nuLookupRecord()->dpl_catl_dml_items);


and your JS could be
Code: Select all
$('#dpl_prj_dml_items_select').val(JSON.parse($('#bob').val()));



Steven
admin
Site Admin
 
Posts: 3108
Joined: Mon Jun 15, 2009 9:53 am


Return to Custom Code