Version complète: jsB@nk » Form » Dropdown » Picklist script
URL: https://www.javascriptbank.com/picklist-script.html
Picklist crée deux champs de formulaire de sélection, et permet à l'utilisateur de facilement transférer des éléments d'un champ à l'autre par le biais de "retour" et "suite" des boutons. Copie à la fois les sélections multiples en maintenant enfoncée la touche Ctrl enfoncée. Cool.
Version complète: jsB@nk » Form » Dropdown » Picklist script
URL: https://www.javascriptbank.com/picklist-script.html
<script LANGUAGE="JavaScript"><!--// PickList script- By Sean Geraty (http://www.freewebs.com/sean_geraty/)// Control flags for list selection and sort sequence// Sequence is on option value (first 2 chars - can be stripped off in form processing)// It is assumed that the select list is in sort sequence initiallyvar singleSelect = true; // Allows an item to be selected once onlyvar sortSelect = true; // Only effective if above flag set to truevar sortPick = true; // Will order the picklist in sort sequence// Initialise - invoked on loadfunction initIt() { var selectList = document.getElementById("SelectList"); var selectOptions = selectList.options; var selectIndex = selectList.selectedIndex; var pickList = document.getElementById("PickList"); var pickOptions = pickList.options; pickOptions[0] = null; // Remove initial entry from picklist (was only used to set default width) if (!(selectIndex > -1)) { selectOptions[0].selected = true; // Set first selected on load selectOptions[0].defaultSelected = true; // In case of reset/reload } selectList.focus(); // Set focus on the selectlist}// Adds a selected item into the picklistfunction addIt() { var selectList = document.getElementById("SelectList"); var selectIndex = selectList.selectedIndex; var selectOptions = selectList.options; var pickList = document.getElementById("PickList"); var pickOptions = pickList.options; var pickOLength = pickOptions.length; // An item must be selected while (selectIndex > -1) { pickOptions[pickOLength] = new Option(selectList[selectIndex].text); pickOptions[pickOLength].value = selectList[selectIndex].value; // If single selection, remove the item from the select list if (singleSelect) { selectOptions[selectIndex] = null; } if (sortPick) { var tempText; var tempValue; // Sort the pick list while (pickOLength > 0 && pickOptions[pickOLength].value < pickOptions[pickOLength-1].value) { tempText = pickOptions[pickOLength-1].text; tempValue = pickOptions[pickOLength-1].value; pickOptions[pickOLength-1].text = pickOptions[pickOLength].text; pickOptions[pickOLength-1].value = pickOptions[pickOLength].value; pickOptions[pickOLength].text = tempText; pickOptions[pickOLength].value = tempValue; pickOLength = pickOLength - 1; } } selectIndex = selectList.selectedIndex; pickOLength = pickOptions.length; } selectOptions[0].selected = true;}// Deletes an item from the picklistfunction delIt() { var selectList = document.getElementById("SelectList"); var selectOptions = selectList.options; var selectOLength = selectOptions.length; var pickList = document.getElementById("PickList"); var pickIndex = pickList.selectedIndex; var pickOptions = pickList.options; while (pickIndex > -1) { // If single selection, replace the item in the select list if (singleSelect) { selectOptions[selectOLength] = new Option(pickList[pickIndex].text); selectOptions[selectOLength].value = pickList[pickIndex].value; } pickOptions[pickIndex] = null; if (singleSelect && sortSelect) { var tempText; var tempValue; // Re-sort the select list while (selectOLength > 0 && selectOptions[selectOLength].value < selectOptions[selectOLength-1].value) { tempText = selectOptions[selectOLength-1].text; tempValue = selectOptions[selectOLength-1].value; selectOptions[selectOLength-1].text = selectOptions[selectOLength].text; selectOptions[selectOLength-1].value = selectOptions[selectOLength].value; selectOptions[selectOLength].text = tempText; selectOptions[selectOLength].value = tempValue; selectOLength = selectOLength - 1; } } pickIndex = pickList.selectedIndex; selectOLength = selectOptions.length; }}// Selection - invoked on submitfunction selIt(btn) { var pickList = document.getElementById("PickList"); var pickOptions = pickList.options; var pickOLength = pickOptions.length; if (pickOLength < 1) { alert("No Selections in the Picklist\nPlease Select using the [->] button"); return false; } for (var i = 0; i < pickOLength; i++) { pickOptions[i].selected = true; } return true;}//--></SCRIPT><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com--><body onLoad="initIt();"><form NAME="theform" ID="theform" ACTION="whatever" onSubmit="return selIt();"><table><tr><td><select NAME="SelectList" ID="SelectList" SIZE="5" multiple="multiple" style="width: 150px"><option VALUE="01sel">Selection 01</option><option VALUE="02sel">Selection 02</option><option VALUE="03sel">Selection 03</option><option VALUE="04sel">Selection 04</option><option VALUE="05sel">Selection 05</option><option VALUE="06sel">Selection 06</option><option VALUE="07sel">Selection 07</option><option VALUE="08sel">Selection 08</option><option VALUE="09sel">Selection 09</option><option VALUE="10sel">Selection 10</option></select></td><td><input TYPE="BUTTON" VALUE="->" ONCLICK="addIt();"></input><br><input TYPE="BUTTON" VALUE="<-" ONCLICK="delIt();"></input></td><td><select NAME="PickList" ID="PickList" SIZE="5" multiple="multiple" style="width: 150px"><option VALUE="01sel">Selection 01</option></select></td></tr><tr><td ALIGN="left"><input TYPE="reset" VALUE="Reset" ONCLICK="javascript: window.location.href = 'picklist.html'"></td><td></td><td ALIGN="right"><input TYPE="submit" VALUE="Submit"></td></tr></table></form></body><!-- This script downloaded from www.JavaScriptBank.com Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->