الأحد، 1 مارس 2009

التعامل مع الـcheckboxes

هذه طريقة بسيطة للتعامل مع مربعات تحديد الخيارات او الـcheckboxes ، لاحظو ان الطريقة ليست تقليدية ، فهي تقوم بالتحقق من اختيار مربع واحد على الاقل قبل الارسال بالاضافة لانها تقوم باظهار رسالة تأكيد ايضاً قبل الارسال .. ، قم بتطبيق المثال لصورة اوضح ..

<script type="text/javascript">
function check_all(element_name, flag, submit) {
var inputs = document.getElementsByTagName('input');
var c = false;
if (flag != false && flag != true) {
flag = true;
}
if (submit != false && submit != true) {
submit = false;
}
for (var i = 0; i < inputs.length; i++) {
if (inputs[i].type == 'checkbox' && inputs[i].name == element_name) {
if (submit == false) {
inputs[i].checked = flag;
} else if (submit == true) {
if (inputs[i].checked == true) {
c = true;
}
}
}
}
if (submit == true) {
if (c == false) {
alert('you didn\'t check any box..');
return c;
} else {
return confirm('are you sure?');
}
}
}
</script>

<form method="post" action="print_r_post_id.php">
<div><input type="checkbox" name="id[]" value="1" /> 1</div>
<div><input type="checkbox" name="id[]" value="2" /> 2</div>
<div><input type="checkbox" name="id[]" value="3" /> 3</div>
<div><input type="button" value="check all" onclick="javascript:check_all('id[]', true);" /> <input type="button" value="uncheck all" onclick="javascript:check_all('id[]', false);" /> <input type="submit" value="delete" onclick="javascript:return check_all('id[]', null, true);" /></div>
</form>

والملف الذي سيستقبل النتائج print_r_post_id.php سيكون على الشاكلة ..

<?php
echo '<pre>';
print_r($_POST['id']);
echo '</pre>';
?>

بالنسبة لـ jquery فيتم تحديد المربعات في حالتنا من خلال سطر واحد ..

$('#form input[name="id[]"][type="checkbox"]').attr('checked', true);

ليست هناك تعليقات:

إرسال تعليق