TWIRED

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

10 posts in this topic

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!

Share this post


Link to post
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>

Share this post


Link to post
Share on other sites
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. 

Share this post


Link to post
Share on other sites
8 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. 

Perhaps this solution will help

Share this post


Link to post
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

Share this post


Link to post
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

Share this post


Link to post
Share on other sites
14 hours ago, Mathilda said:

Perhaps this solution will help

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

Share this post


Link to post
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

diversity likes this

Share this post


Link to post
Share on other sites

HI Diversity,

 

As Mathilda mentioned,

you have to hit "Source" button (in footer) 

and then paste the code in.

 

Also,

Hold down Control key when selecting from the listbox.

 

 

 

diversity likes this

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now