Question

I’m trying to give the user ability to create customized list for my application,by insert his choices in text area field ,each line is treated as one choice using the \n (enter) as separator , i need to allow user to enter one choice in multiple lines,any one can help?

<textarea></textarea>

user enter :
aa
bb
cc
with enter in textarea, and then I’m processing them to split them at enter separator ,so i have three option in list :1-aa ,2-bb,and 3-cc ,but what i need to make aa ,bb is the first option, and cc second option ,i need new separator, i need more ideas?

Answer 1

This code will allow for the options to be entered on multiple lines and the options are created once you press Enter twice:

JavaScript

<script type="text/javascript">
  var LastKeyCode=-1;

  function updateOptions(e) {
    if (e.keyCode) {
      var KeyCode=e.keyCode;
    } else {
      var KeyCode=e.charCode;
    }

    if (KeyCode==13 && LastKeyCode==13) { // Enter?
      var RowsDataAry=document.getElementById('inputfield').value.replace(/\r\n/g,"\n").split(/\n{2,}/g);  // Fix IE CRs and split the textarea input

      document.getElementById('choices').options.length=0;  // Empty select

      for (RowID in RowsDataAry) {
        var TextVal=RowsDataAry[RowID].replace(/\n/g,", ").replace(/, $/,"");   // Set commas and remove the last comma

        document.getElementById('choices').options.length++;
        document.getElementById('choices').options[RowID].value=RowID;  // Add option value
        document.getElementById('choices').options[RowID].text=TextVal;
;  // Add option text
      }
    }

    LastKeyCode=KeyCode;
  }
</script>

HTML

<select id="choices" size="20"></select>

<textarea id="inputfield" onkeypress="updateOptions(event)" cols="40" rows="20"></textarea>

Tested in Firefox 3.6.3, Opera 10.53, IE 8 and Iron 5.0.380 .