checkbox 實現單選

要做一個用checkbox打分的功能 , 打分項和分值都是通過枚舉配置的,前臺用EL表達式 循環出來

效果:
這裏寫圖片描述

jsp:

<script type="text/javascript">
//校驗必須要打分
  function checkqualitygrade(){
    var flag =true;
    var _gradesnodes = $("input[id ^= 'hiddenqgitem_']");
    //先清空
    $.each(_gradesnodes, function(_i, _el){
       _el.value ='';
    });
  //再賦值
    var gradesnodes = $("input[id ^= 'qgitem_']");
    $.each(gradesnodes, function(i, el){
      var obj = document.getElementsByName('hidden'+el.id);
      if(el.checked){
        $(obj).stk_val(el.value);
      }
    });
  //校驗
    $.each(_gradesnodes, function(_i, _el){
      if( _el.value ==null || _el.value =='')
      flag =false;
    });
    return flag;
  }
  function clickCheckBox(element){
    var elementName = $(element).attr("name");
    var obj = document.getElementsByName(elementName);
    for (i=0; i<obj.length; i++){
      if (obj[i]!=element ){
        obj[i].checked = false;
      }
      else  obj[i].checked = element.checked;
//      else obj[i].checked = true;
    }
  }
</script>
<div style="margin-top:10px;margin-bottom: 10px">
  <table width='800px' class='stk-table stk-table-bbline'>
    <tr>
      <th colspan="3" class='stk-table-th' style='text-align: left'>Quality Grade</th>
    </tr>
    <tr>
      <td class="stk-table-td alignC"></td>
      <td class="stk-table-td alignC" style="font-weight: bold;"> Grade Item</td>
      <td class="stk-table-td alignC" style="font-weight: bold;"> Score Value</td>
    </tr>
    <c:forEach items="${qualitygradeitems}" var="items" varStatus="i">
      <tr>
        <td class="stk-table-td alignC">${i.index+1}</td>
        <td class="stk-table-td alignL"> ${items.name}</td>
        <td class="stk-table-td alignC">
          <c:set var="key" value="G_${empid}_${items.value}" scope="page"/>
          <c:forEach items="${qualitygradevalues}" var="values" >
            <label>${values.name}
              <input name="qgitem_${empid}_${items.value}_value" id="qgitem_${empid}_${items.value}_value"
                     type="checkbox" value="${values.value}" onclick="clickCheckBox(this)"
                     ${(values.value eq grademap[key]) ? 'checked' : ''} /></label>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          </c:forEach>
          <input type="hidden" name="hiddenqgitem_${empid}_${items.value}_value" id="hiddenqgitem_${empid}_${items.value}_value" />
        </td>
      </tr>
    </c:forEach>

    </table>
  </div>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章