Full version: jsB@nk » Form » renderSelectOptions: Process data selection
URL: https://www.javascriptbank.com/renderselectoptions-process-data-selection.html
Name of this JavaScript is defined as a function, processing all values of a specified selection and display them, very useful if you want to copy some text selection, multiple selection value.
Full version: jsB@nk » Form » renderSelectOptions: Process data selection
URL: https://www.javascriptbank.com/renderselectoptions-process-data-selection.html
<script type="text/javascript"><!--// Created by: Wesley Riley :: http://picasaweb.google.com/rileywesleyfunction renderSelectOptions() {var containerStyle = 'border:1px solid black;width:200px;margin-bottom:5px;font-family:Calibri;';var headingStyle = 'margin:0px;padding:3px;text-align:center;background-color:SteelBlue;color:white;';var oddDetailStyle = 'display:block;border-top:1px solid black;background-color:#e9e9e9;padding-left:3px;';var evenDetailStyle = 'display:block;border-top:1px solid black;background-color:LightSteelBlue;padding-left:3px;';var selectArray = document.getElementsByTagName('select');var theHtml = '';var currentStyle = 'evenDetailStyle';for(i=0;i<selectArray.length;i++) {theHtml += '<div id="div_' + selectArray[i].name + '" style="' + containerStyle + '"><h4 style="' + headingStyle + '">' + selectArray[i].name + '</h4>';var optionArray = selectArray[i].getElementsByTagName('option');for(n=0;n<optionArray.length;n++) { if(currentStyle == 'evenDetailStyle') currentStyle = 'oddDetailStyle'; else currentStyle = 'evenDetailStyle'; theHtml += '<span style="' + eval(currentStyle) + '">' + optionArray[n].innerHTML + '</span>';} theHtml += '</div>';}document.write(theHtml);}//--></script><p><strong>Music Type</strong><br><select id="selectType" name="musicType"> <option value="blues">Blues</option> <option value="rock">Rock</option> <option value="rocknroll">Rock 'n Roll</option> <option value="meatl">Metal</option> <option value="classical">Classical</option> <option value="bluegrass">Bluegrass</option> <option value="trance">Trance</option> <option value="jazz">Jazz</option></select></p> <p><strong>Instrument Type</strong><br><select id="selectInstrument" name="instruType"> <option value="guitar">Guitar</option> <option value="bass">Bass</option> <option value="drums">Drums</option> <option value="harmonica">Harmonica</option> <option value="violin">Violin</option> <option value="cello">Cello</option> <option value="organ">Organ</option> <option value="sax">Saxophone</option></select></p><b>All items above listed</b><br /><script type="text/javascript"> renderSelectOptions()</script>