PHP動態創建與JQuery複選框.toggle（）

Question

我已經動態地創建了PHP中的複選框數組的窗體，但我不想提交按鈕出現，除非至少有一個複選框被選中。在互聯網上搜索大多數希望提交按鈕僅在檢查複選框後纔出現的用戶只有一個「我同意」複選框。它是阻止我的腳本工作的動態創建嗎？

PHP↴

// Dynamically create checkboxes from database 
function print_checkbox($db){ 
    $i = 0; 
    foreach($db->query('SELECT * FROM hue_flag') as $row) { 
     if ($i == 0 || $i == 3 || $i== 6 || $i == 9){ 
      echo '<br><br>'; 
     } 
     $i++; 
     echo '<span class="'.$row['1'].'"><label for="'.$row['1'].'">'.ucfirst($row['1']).'</label><input type="checkbox" name="hue[]" id="hue" value="'.$row['0'].'"></span> '; 
    } 
} 

jQuery↴

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $('#hue[]').click(function(){ 
     $('#input_gown').toggle(); 
    }); 
}); 
</script> 

PHP函數call↴

<?php print_checkbox($conn_normas_boudoir);?> 

誠然，我什麼都不知道的jQuery或JavaScript和我仍然在學習PHP。所以，如果有更好的方法來實現這一點，讓我知道。

Answer 1

你給你所有的複選框相同的ID。這是不允許的; ID必須是唯一的。

一個簡單的解決這兩個問題是分配的所有複選框共同類型：

echo '<span class="'.$row['1'].'"><label for="'.$row['1'].'">'.ucfirst($row['1']).'</label><input type="checkbox" name="hue[]" class="hue" value="'.$row['0'].'"></span> '; 

然後在jQuery的選擇類：

$('.hue').change(function(){ 
    $('#input_gown').toggle(); 
}); 

但這種情況可能會出現意想不到的結果;如果檢查兩個複選框會怎麼樣？ #input_gown元素將再次打開和關閉。也許你只是想，如果至少一個複選框被選中它顯示：

$('.hue').change(function(){ 
    var val = false; 
    $('.hue').each(function() { 
     val = val || $(this).is(':checked'); // any checked box will change val to true 
    }); 
    $('#input_gown').toggle(val); // true=show, false=hide 
}); 

http://jsfiddle.net/mblase75/AyY3Z/

Answer 2

您的jQuery選擇器正在尋找編號爲hue[]的元素。但是你的元素只有hue。

更改此：↴

$(document).ready(function(){ 
    $('#hue[]').click(function(){ 
     $('#input_gown').toggle(); 
    }); 
}); 

這個（ID應該真的永遠是獨一無二的，而方括號需要進行轉義與選擇的發動機工作），（a demo））：↴

$(document).ready(function(){ 
    $('input[name=hue\\[\\]]').click(function(){ 
     $('#input_gown').toggle(); 
    }); 
});