»
AnglaisFran�aisVietnamien

Imprimer - Picklist script - JavaScriptBank.com

Version compl�te: jsB@nk » Form » Dropdown » Picklist script
URL: https://www.javascriptbank.com/picklist-script.html

Picklist script © JavaScriptBank.comPicklist 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



JavaScript
<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-->


HTML
<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-->