Elena Posted November 10, 2015 Report Share Posted November 10, 2015 Hello there, In my multi-select box, I have quite a bit of items one can select. The problem that I'm seeing is that, sometimes users select all of these items when some are actulaly not applicable to them. So, I would like to limit the selection to 5, and provide an alert message that says "please limit your selection to five items". Below is my code for my multi-select. Can you please let me know how might I be able to limit the selection to say, 5 selections maximum? Thank you so much, and as always guidance is appreciated. <script type="text/javascript"> /*var v_Knowledge_New = "[@field:Knowledge_New]" ; var o_Knowledge_New= document.getElementById("EditRecordKnowledge_New") ; o_Knowledge_New.multiple = true ; function f_listbox() { if ( v_Knowledge_New.indexOf(",") > 0 ) { for (var i=0 ; i < o_Knowledge_New.options.length; i++ ) { if(o_Knowledge_New.value == v_Knowledge_New) { o_Knowledge_New.remove(i); break ; } } var o_st = v_Knowledge_New.split(", ") ; for (var j=0 ; j < o_st.length; j++) { for (var i=0 ; i < o_Knowledge_New.options.length; i++ ) { if(o_st[j]== o_Knowledge_New.options.value){ o_Knowledge_New.options.selected = true ; break ; } } } } } window.onload = f_listbox ;*/function findMultiSelectOption(id){var select = $('#'+id);select.attr('multiple',true);var option = $('#'+id+' option:selected');if(option.length > 0){var splited = option.val().split(', ');if(splited.length > 1){option.attr('selected', false).remove();var value_map = {};for(var i = 0; i < splited.length; i++){value_map[splited]=splited;}select.find('option').each(function(i, el){if(el.value in value_map){el.selected = true;}});}}}findMultiSelectOption('EditRecordKnowledge_New');</script> Quote Link to comment Share on other sites More sharing options...
Xiang Posted November 11, 2015 Report Share Posted November 11, 2015 Hi Elena, How are you? How's the weather in your city? I think, the following code checks the number of selections: <SCRIPT LANGUAGE="JavaScript"> function check_listbox() { var maximum_selections = 5; var MyListbox = document.getElementsByName("EditRecordFieldName")[0]; var number_selections = 0; for (var i=0; i<MyListbox.length; i++) { if (MyListbox.options[i].selected) number_selections++; } if (number_selections>maximum_selections) { alert("You can select only " + maximum_selections + " items"); return false } } document.getElementById("caspioform").onsubmit=check_listbox; </SCRIPT> You can add it after your current code. Don't forget to change names FieldName to the names of your fields. I'll be grateful, if you tell me if the code works.Have a nice day! Quote Link to comment Share on other sites More sharing options...
Elena Posted November 13, 2015 Author Report Share Posted November 13, 2015 Hi there Xiang, Thank you for the prompt reply and for guidance. The weather here is great today, but expecting some good rainfall in a few days as forecasted. The code did not work though. I simply added the code below my existing code and changed the field name to the appropriate one as advised. I wonder where we're going wrong. Quote Link to comment Share on other sites More sharing options...
Xiang Posted November 23, 2015 Report Share Posted November 23, 2015 Hi Elena, I've worked with your code. In my form the following code works: <script> var v_Knowledge_New = "[@field:Knowledge_New]" ; var o_Knowledge_New= document.getElementById("EditRecordKnowledge_New") ; o_Knowledge_New.multiple = true ; function f_listbox() { if ( v_Knowledge_New.indexOf(",") > 0 ) { for (var i=0 ; i < o_Knowledge_New.options.length; i++ ) { if(o_Knowledge_New[i].value == v_Knowledge_New) { o_Knowledge_New.remove(i); break ; } } var o_st = v_Knowledge_New.split(", ") ; for (var j=0 ; j < o_st.length; j++) { for (var i=0 ; i < o_Knowledge_New.options.length; i++ ) { if(o_st[j]== o_Knowledge_New.options[i].value){ o_Knowledge_New.options[i].selected = true ; break ; } } } } } window.onload = f_listbox ; function check_listbox() { var maximum_selections = 5; var MyListbox = document.getElementsByName("EditRecordKnowledge_New")[0]; var number_selections = 0; for (var i=0; i<MyListbox.length; i++) { if (MyListbox.options[i].selected) number_selections++; } if (number_selections>maximum_selections) { alert("You can select only " + maximum_selections + " items"); return false } } document.getElementById("caspioform").onsubmit=check_listbox; </SCRIPT> I've deleted a function, I think, it duplicates the functional and doesn't work in my account. Is it lost anything if this code is entered instead of the existed? Quote Link to comment Share on other sites More sharing options...
Elena Posted November 24, 2015 Author Report Share Posted November 24, 2015 Hello Xiang, Thank you a million! This works now on my form too. Thank you. Quote Link to comment Share on other sites More sharing options...
Kurumi Posted September 8, 2021 Report Share Posted September 8, 2021 Hi @Elena ! Just an update on this post, you may also check this for solution: Quote Link to comment Share on other sites More sharing options...
Recommended Posts
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.