Jump to content

Multi Select Listbox (Submission Form) - On Error - Javascript Code Required


Recommended Posts

Any help would be appreciated ! Thanks~

 

REQUIREMENT FOR  Multi-Select Listbox in a Submission Form

If a form has a listbox and other element fields,

If the other fields are required and not filled in,

 

On Submit

The form should not submit (required fields not completed)

BUT

the listbox SHOULD RETAIN  the values selected 

 

 

If the form is filled correctly (all required fields are complete)

Then submit & store  values selected in delimited string to table field.

 

[SOLUTION} Below...

Thanks!

Link to comment
Share on other sites

Got a script to work.,...  This a script I found on the forum and tweaked.

SUBMISSION FORM- MULTI LISTBOX SCRIPT

---------------------------------------------------------------

<script>
 var fieldName = "InsertRecordMultiListbox";
   var x=document.getElementsByName(fieldName);
   x[0].multiple=true;


function select_ (){
// get listbox element

var listbox = document.getElementById("InsertRecordMultiListbox");
// get listbox length
var len = listbox.options.length;
// get selected element
var selected = listbox.options[len-1].value;
// verify if selected element contains comas, if yes, do the following
if (selected.indexOf(",") != -1 ){
// Split selected option into array
var m_array = new Array();m_array=selected.split (", ");
// Delete last option from the listbox
listbox.options.remove(len-1);
// Go through listbox and select each option, if it is present in array
for( var i=0; i< m_array.length; i++ ){for( var j=0; j< len-1; j++ ){
// Trim spaces while comparing elements from array and listbox
if( m_array.replace(/^s+|s+$/g,"") == listbox.options[j].value ){
listbox.options[j].selected = "selected";
}}}}}


window.onload = select_;

</script>

Link to comment
Share on other sites

  • 4 weeks later...
On 1/19/2017 at 11:03 AM, TWIRED said:

Got a script to work.,...  This a script I found on the forum and tweaked.

SUBMISSION FORM- MULTI LISTBOX SCRIPT

---------------------------------------------------------------

<script>
 var fieldName = "InsertRecordMultiListbox";
   var x=document.getElementsByName(fieldName);
   x[0].multiple=true;
function select_ (){


// get listbox element

var listbox = document.getElementById("InsertRecordMultiListbox");
// get listbox length
var len = listbox.options.length;
// get selected element
var selected = listbox.options[len-1].value;
// verify if selected element contains comas, if yes, do the following
if (selected.indexOf(",") != -1 ){
// Split selected option into array
var m_array = new Array();m_array=selected.split (", ");
// Delete last option from the listbox
listbox.options.remove(len-1);
// Go through listbox and select each option, if it is present in array
for( var i=0; i< m_array.length; i++ ){for( var j=0; j< len-1; j++ ){
// Trim spaces while comparing elements from array and listbox
if( m_array.replace(/^s+|s+$/g,"") == listbox.options[j].value ){
listbox.options[j].selected = "selected";
}}}}}


window.onload = select_;
</script>

Definitely not working for me.   I posted this in the Footer and changed the "InsertRecordMultiListbox" for my field but still only selects one item. 

Link to comment
Share on other sites

16 hours ago, diversity said:

Definitely not working for me.   I posted this in the Footer and changed the "InsertRecordMultiListbox" for my field but still only selects one item. 

Hi Diversity,

If yourlistbox field name is say, "LSTBOX", then you need to :- change it at both places in the script ,

in your submission form (in footer - configure fields section)  to InsertRecordLSTBOX

If its an update form then change to EditRecordLSTBOX

 

Destination of Submission form : Same Form

 

Heres a live working example:

http://www.tripatwork.com/test-multilistbox-submit.html

 

also attached is my settings for the listbox field element

 

It definitely works, and it works well !

 

Hope this helps:)

 

Thanks

 

 

Listbox_Element_Setting.JPG

ListboxTable_Field.JPG

MultiListbox_Form_selected.JPG

Listbox_Element_Advanced_Setting.JPG

Lookup_Table_for_Listbox.JPG

Link to comment
Share on other sites

6 hours ago, TWIRED said:

Hi Diversity,

If yourlistbox field name is say, "LSTBOX", then you need to :- change it at both places in the script ,

in your submission form (in footer - configure fields section)  to InsertRecordLSTBOX

If its an update form then change to EditRecordLSTBOX

 

Destination of Submission form : Same Form

 

Heres a live working example:

http://www.tripatwork.com/test-multilistbox-submit.html

 

also attached is my settings for the listbox field element

 

It definitely works, and it works well !

 

Hope this helps:)

 

Thanks

 

 

Listbox_Element_Setting.JPG

ListboxTable_Field.JPG

MultiListbox_Form_selected.JPG

Listbox_Element_Advanced_Setting.JPG

Lookup_Table_for_Listbox.JPG

Still not working.  I even created two new tables to try it out.  I keep getting this when I do it.  Obviously it's not showing the full code, but when I put it in my footer it just shows the code.  And yes the HTML is enabled

caspio1.png

Link to comment
Share on other sites

1 hour ago, diversity said:

Even when I put this code in, I'm having the same issues as described above.  The javascript just shows on my page and doesn't work

You need to hit the source tab before inserting code to the footer. This article should help.

Also don't forget to change the filed name in the code and you need to hold the Ctrl key on the keyboard while clicking on the required values simultaneously.  

Hope that helps

Link to comment
Share on other sites

  • 1 month later...

Is there a solution that works on mobile? 

Results are very wonky on iPhone, both Safari and Chrome. Total number of selections displayed is frequently wrong, the list will automatically select the first answer if you click Done without selecting an answer, every time you enter the form and leave without doing anything, it changes the number of items selected up and down and up and down.... and other behaviors.

 

 

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...