<script language="Javascript" src="../jslib/dualSelectControl.js"></script>
  <!-- some comment here -->
  <script>
   var extraValues = ' ';
   var hasSections = 0;
   
   function setValuesAndClose(formName,fieldName) {
    var openerFormName = formName;
    var openerFieldName = fieldName;
    var delimiter = ';';
    var selectedValues = convertSelectedValues();

    extraValues = unescape(extraValues); //zhao

    if(extraValues != null && extraValues.length > 0) {
     if(selectedValues.length <= 0) {
      selectedValues = extraValues;
     } else {
      selectedValues = filter(extraValues, selectedValues, delimiter);
      selectedValues = extraValues + delimiter + selectedValues;
     }
    } // if  
    
    if(extraValues != null && extraValues.length > 0) {
     if(selectedValues.length <= 0) {
      selectedValues = extraValues;
     } else {
      selectedValues = extraValues + delimiter + selectedValues;
     }
    } // if
    
 
    //eval('opener.document.' + openerFormName + '.' + openerFieldName + ".value = selectedValues");
    eval('opener.document.all("' + openerFieldName + '")').value = selectedValues;
    
    this.close();
   }
   
   function filter(extraValues, selectedValues, delimiter) {

    if(extraValues == null || extraValues.length <= 0) {
     return selectedValues;
    }
    var extraArr = extraValues.split(delimiter);
    var selectedArr = selectedValues.split(delimiter);
    var i=0;
    for(i=0; i<extraArr.length; i++) {
     var index = indexOf(selectedArr, extraArr[i]);
     if(index >= 0) {
      selectedArr.splice(index, 1);
     } 
    }

    if(selectedArr.length <= 0) {
     return '';
    } else {
     return selectedArr.join(delimiter);
    }

   }

   function indexOf(selectedArr, strValue) {
    var i=0;
    for(i=0; i<selectedArr.length; i++) {
     if(strValue == selectedArr[i]) {
      return i;
     }
    }
    return -1;
   }
    
   function convertSelectedValues() {
    var delimiter = ';';
    var selectBox = eval('document.DualSelectForm.' + 'SelectedValues');
    var selectedItems = selectBox.options.length;
    var i=0;
    var selectionNames = "";
    var value;
    var text;
    var valueSepIndex;
    
    for(i=0; i< selectedItems; i++) {
     if(selectBox.options[i].selected = true) {
      text = selectBox.options[i].text;
      value = selectBox.options[i].value;

      // ignore the section delimiters
      if(value.indexOf('_') != 0) {
       // if sections are present, value = value_1, value_2 etc.
       // the value of hasSections will be set by the DualSelectTag
       // based on whether diff sections are available or not. ks 12/04/01
       if(hasSections > 0) {
        valueSepIndex = value.lastIndexOf('_');
       } else {
        valueSepIndex = -1;
       }
       if(valueSepIndex < 0) {
        valueSepIndex = value.length;
       }
       selectionNames = selectionNames + delimiter + value.substring(0, valueSepIndex);
      }
     }
    }
    if(selectionNames.indexOf(delimiter) == 0) {
     selectionNames = selectionNames.substr(1);
    }
    
    return selectionNames;
   }
   //modified by joshua xie 2004-06-12
   function convertSelectedValues2() {
    var delimiter = ';';
    var selectBox = eval('document.DualSelectForm.' + 'SelectedValues');
    var selectedItems = selectBox.options.length;
    var i=0;
    var selectionNames = "";
    var value;
    var text;
    var valueSepIndex;
    
    for(i=0; i< selectedItems; i++) {
     if(selectBox.options[i].selected = true) {
      text = selectBox.options[i].text;
      value = selectBox.options[i].value;

      // ignore the section delimiters
      if(value.indexOf('_') != 0) {
       // if sections are present, value = value_1, value_2 etc.
       // the value of hasSections will be set by the DualSelectTag
       // based on whether diff sections are available or not. ks 12/04/01
       if(hasSections > 0) {
        valueSepIndex = value.lastIndexOf('_');
       } else {
        valueSepIndex = -1;
       }
       if(valueSepIndex < 0) {
        valueSepIndex = value.length;
       }
       //selectionNames = selectionNames + delimiter + value.substring(0, valueSepIndex);
       text=text.split("--")[0];
       value =text;
       selectionNames = selectionNames + delimiter + value;
      }
     }
    }
    if(selectionNames.indexOf(delimiter) == 0) {
     selectionNames = selectionNames.substr(1);
    }
    return selectionNames;
   }

   function keyPress()
   {
    if (window.event.keyCode == 13)
    setValuesAndClose();
   }
   
   function doOnloadActions() {
   if (opener) opener.blockEvents();
   adjustDualSelectElementWidths();
   window.resizeTo (width, height);
  }
  </script>
 </HEAD>
 <body onLoad="doOnloadActions()">
  <table class="infoObjectTable" width="450" cellpadding="3" cellspacing="0" border="0">
   <tr valign="top">
    <td class="infoObjectText"><span class="infoObjectText">&nbsp;<img src="../images/ShowInfo.gif" alt="Information" width="16" height="16" border="0">&nbsp;</span>
    </td>
    <td class="infoObjectText"><span class="infoObjectText">在 [可用] 清單中選擇值，按一下向右鍵，然後按一下
      [確定]。</span>
    </td>
   </tr>
  </table>
  <form name="DualSelectForm" method="post" action="HcmServlet" onsubmit="return false;">
   <table border="0">
    <tr>
     <td>鍵入名稱或從清單選擇:</td>
    </tr>
    <tr>
     <td><input type="text" name="optionFinder" class="formElm" style="WIDTH:205px" onkeyup="locateOption(this, document.DualSelectForm.from)"
       onkeypress="moveOptionsOnEnter(event, this, 'from', 'SelectedValues','DualSelectForm',true);"></td>
    </tr>
   </table>
   <!-- Custom tag for rendering the Dual select box -->
   <script> extraValues = '';</script>
   <table border="0">
    <tr>
     <th align="center">
      可用值</th><td></td>
     <th align="center">
      所選值</th></tr>
    <tr>
     <td align="right" width="205"><div id="from_div">
       <select name="from" multiple size="14" ondblclick="moveOptions('from', 'SelectedValues', 'DualSelectForm',true);"
        class="formElm" width="205px" height="200px">
        <%=viewstate("listvalue")%>
       </select></div>
     </td>
     <td align="center">
      <a href="javascript:moveOptions('from', 'SelectedValues', 'DualSelectForm',true);"><img src="../images/moveright.GIF" width="16" height="16" border="0" alt="右移"></a><br>
      <br>
      <br>
      <a href="javascript:moveOptions('SelectedValues', 'from', 'DualSelectForm',true);"><img src="../images/moveleft.GIF" width="16" height="16" border="0" alt="左移"></a>
     </td>
     <td align="left" width="205"><div id="SelectedValues_div">
       <select name="SelectedValues" multiple size="14" ondblclick="moveOptions('SelectedValues', 'from', 'DualSelectForm',true);"
        class="formElm" width="205px" height="200px">
       </select></div>
     </td>
    </tr>
   </table>
   <div align="center">
    <table border="0">
     <tr height="50">
      <td align="right">
       <input type="button" name="OK" onmouseover="style.color='#33ffcc'" onmouseout="style.color='#ffffff'"
        class="buttonDefault" value="確定" onClick="javascript:setValuesAndClose('Form1','<%=viewstate("fieldid")%>');">
      </td>
      <td align="left">
       <input type="button" name="Cancel" onmouseover="style.color='#33ffcc'" onmouseout="style.color='#ffffff'"
        class="buttonDefault" value="取消" onClick="javascript:self.close();">
      </td>
     </tr>
    </table>
   </div>
   </INPUT>
   <script>
    registerDualSelectElement('DualSelectForm','from','SelectedValues',200,380);
    registerDualSelectElement('DualSelectForm','from','SelectedValues',200,380);
   </script>
   <script>
   <!--
    document.DualSelectForm.optionFinder.focus();
   -->
   </script>
  </form>
 </body>