[Checkbox]善用 or / and 實現多選項目, 資料表欄位不用增加

[Checkbox]善用 or / and 實現多選項目, 資料表欄位不用增加

這不是原創文, 是從專案中學習而來的.

 

先給sample code

<html>
<head>
<title></title>
<script src="jquery-1.7.1.js"></script>
<script> 
    $(function(){
        $('#my_eval').click(function(){
            var sum = 0;
            $('input[type="checkbox"]').each(function(){
                $cbx = $(this);
                if($cbx.attr('checked')){
                    sum = sum | parseInt($cbx.val())
                }
            });
            $('#txt').val(sum);    
        });
        
        $('#my_set').click(function(){
            var sum = $('#txt').val();
            $('input[type="checkbox"]').each(function(){
                $cbx = $(this);
                var checked = (sum & parseInt($cbx.val()))>0;
                $cbx.attr('checked',checked); 
            });
        });
    });
    
    
</script>
</head>
 
<body>
<input type="checkbox" id="c_1" name="cb" value="1">
<input type="checkbox" id="c_2" name="cb" value="2">
<input type="checkbox" id="c_4" name="cb" value="4">
<input type="checkbox" id="c_8" name="cb" value="8">
 
<input type="button" id="my_eval" value="Eval">
<br />
<input type="text" id="txt">
<input type="button" id="my_set" value="Set">
 
</body>
</html>

 

 

畫面中共有4個checkbox, 而資料庫只有設計一個欄位放置使用者的輸入, 此時二進位登場,

每一個checkbox都代表一個二進位的進位位址. 如: 二進位(0 1 0 0) = 十進位(4), 二進位(1 0 0 0) = 十進位(8) ...

然後當我們在送出資料給資料庫儲存時, 只需要把所有被勾選的值 OR 起來, 即為總合, 資料表只要一個欄位存起來就好.

未來就算多幾個選項也沒關係, 都不用擴充資料表欄位.

 

回到畫面顯示時, 資料表會將總合的值回傳回來, 只需要將每一個checkbox的值拿去做AND, 若之前有被加總過就會是自己的值(或直接判斷>0)

這樣就可以把該勾選的勾起來囉.

 

當然這也是有些缺點, 因為資料庫在查詢時就必須依賴方法來處理. 如: ORACLE. bitand( express1 , express1)

select bitand(15,2) from dual ;

加上無法使用者索引(Index). 效能會較差.