Использование JQuery для извлечения данных из флажков

Question

Я довольно новичок в JQuery и javascript и сначала прыгнул в голову, и я немного застрял.

У меня есть страница, где нажатие кнопки открывает небольшой оверлей через вызов AJAX, а затем дает целую кучу флажков для выбора пользователями тегов, которые они хотят связать с ключевыми словами. Затем я пытаюсь обработать флажки с помощью другого вызова ajax для обработки. Пока все выглядит нормально, за исключением того, что я не могу получить данные, из которых отмечены флажки, а какие нет в форме.

Я использую jquery, PHP & MySQL combo; см. ниже фрагмент.

<form method="post" > 
<h1>Categories</h1> 
<fieldset id="edit_box"> 
     <legend>Choose Tags</legend> 

<?php 
// $tags is an array with all the original values from the database, so a list of available tags and if they are set for each category 
foreach($tags as $value){ 
     if(isset($value['set']) && $value['set'] ==1) $set = "checked = 'checked'"; else $set = ""; 
     echo'<p class="floatlist"> 
     <input type="checkbox" name="'.$value['id'].'" id="'.$value['id'].'" '.$set.' /> 
     <label for="'.$value['id'].'" class="inline">'.$value['name'].'</label> 
</p>'; 
} 
     ?> 
<p><button type="button" id="update_tags">Save Changes</button></p> 
</fieldset>  
</form> 

<script type="text/javascript"> 
     $("#update_tags").click(function(){ 
       var data = new Array(); 
       $('#edit_box input').each(function() { 
         var tagid = $(this).attr('id'); 
         if($('#'+tagid).attr('checked')){data[tagid] = '1';} else {data[tagid] = 0;} 
       }); 

       $.post("inc/process_tags.php", { page: "update_tags", categories: data }, function(data){ 
         var output = data; 
         $('#edit_box').html(output); 

       });        
     }); 

</script> 

На данный момент я получаю массив из этого, что соответствует оригинальным вариантам (так что если пункт 1 3 & 5 были проверены, они правильно показывают), однако, если я изменить переменные, прежде чем я представить его, (меняя его так, что пункт 1 2 & 5 были проверены), он все еще показывает результат как исходные элементы (1 3 & 5). Что мне здесь не хватает?

У меня нет, к сожалению, доступа к живому примеру, который я могу вам дать.

Заранее благодарен!

Answer 1

Если вам просто нужно проверил пункты:

$("#update_tags").bind("click", function(){ 
    var data = []; 

    // :visible is optional 
    $('#edit_box').find("input[type='checkbox']:checked:visible").each(function(){ 
     var $t = $(this),   // current checkbox 
      id = $t.attr('id');  // checkbox id 

     data[id] = '1'; 

     // insert additional code here 

    }); 
    }); 

или если вы хотите, чтобы перебрать все CheckBox элементов:

$("#update_tags").bind("click", function(){ 
    var data = []; 

    // :visible is optional 
    $('#edit_box').find("input[type='checkbox']:visible").each(function(){ 
     var $t = $(this),   // current checkbox 
      id = $t.attr('id');  // checkbox id 

     data[id] = $t.is(":checked") ? '1' : '0'; 

    // insert additional code here 

    }); 
    }); 

Надеется, что это помогает ,

Answer 2

JQuery как функциональность, которая может выбирать элементы с проверкой (работает для радио и флажков). Взгляните на проверенный селектор.

http://api.jquery.com/checked-selector/

Answer 3

Несколько вариантов:

Если вам нужны выбранные флажки в JS (предполагающие флажки имеют общий класс):

$(".checkbox_class:checked").each(function(){ 
    // All of the checked boxes are iterated, $(this).val(); 
}); 

Если вы хотите получить список из выбранные флажки в объекте $ _POST в PHP, вы сначала измените свою разметку, чтобы иметь общий массив имен для каждого флажка:

<input type="checkbox" name="tags[]" value="php the value" /> 

Тогда .. в PHP

print_r($_POST['tags']); // outputs array of all checked tags