Передача нескольких элементов-флажков в файл PHP с использованием JSON и запрос к БД

Question

Я пытаюсь передать несколько флажков с разными значениями в скрипт PHP, который будет выполнять поиск в моей базе данных по выбранным значениям.

Форма HTML выглядит следующим образом:

                <li><input type="checkbox" class="keywords"  value="option1" title="option1" /></li>
                <li><input type="checkbox" class="keywords"  value="option2" title="option2" /></li>
                <li><input type="checkbox" class="keywords"  value="option3" title="option3" /></li>
                <li><input type="checkbox" class="keywords"  value="option4" title="option4" /></li>
                <li><input type="submit" name="submit" class="search" /></li>

Код javascript для передачи этого в мой файл PHP:

        <script type="text/javascript">
    $(document).ready(function(){
        $(".search").click(function()
        {           
        $.post("parser.php", 
                    { 
                        keywords: $(".keywords:checked").val() 
                    }, 
                   function(data)
                   {        
                        $.each(data, function()
                        {   
                            $("div#result").append("<li class='arrow'><a href='parser.php?id=" + this.id + "'>" + this.title + "</a></li>");
                        });

                        $("div#jsonContent").show();

                    }, 
            "json");

        });

    });
    </script>

В parser.php я беру входящее ключевое слово и ищу в базе данных:

$keywords = mysql_real_escape_string ($_GET["keywords"]);
$query = mysql_query("SELECT * FROM keyworddb WHERE keywords LIKE '%". $keywords ."%' ");
$arr = array();
while( $row = mysql_fetch_array ( $query ) )
{
$arr[] = array( "id" => $row["id"], "title" => $row["title"] );
}
echo json_encode($arr);

Это все замечательно, работает без ошибок, кроме:

1) В firebug он отправляет выбранное значение флажка, но не несколько флажков. Используется только первое значение флажка, если выбрано несколько флажков.

2) Несмотря на это, он возвращает все записи в таблицу :( независимо от того, что выбрано.

Любая помощь приветствуется.

Обновление:

Я сделал предложенные чанги:

            <form id="findkeywords">
            <ul>
                <li><input type="checkbox" class="keywords[]"  value="option1" title="option 1" /></li>
                <li><input type="checkbox" class="keywords[]"  value="option2" title="option 2" /></li>
                <li><input type="checkbox" class="keywords[]"  value="option3" title="option 3" /></li>
                <li><input type="checkbox" class="keywords[]"  value="option4" title="option 4" /></li>
                <li><input type="submit" name="submit" class="search" /></li>
            </ul>
            </form>

Javascript был изменен на:

        $(document).ready(function(){
        $(".search").click(function()
        {            
        $.post("parser.php", 
                       { 
                           keywords: $("form#findkeywords").serialize() 
                       }, 
                   function(data)
                   {        
                        $.each(data, function()
                        {    
                            $("div#result").append("<li class='arrow'><a href='parser.php?id=" + this.id + "'>" + this.title + "</a></li>");
                        });

                        $("div#jsonContent").show();

                    }, 
            "json");

        });

    });

Я еще не внес никаких дополнительных изменений в файл php, так как я просто хочу убедиться, что он действительно передает данные. Но в FireBug он вообще ничего не посылает.

Answer 1

Проблема с использованием .val() в том виде, в каком вы есть, заключается в передаче массива данных, для этого вам придется использовать библиотеку JSON, чтобы «преобразовать ее в строку» для отправки на ваш php.Если вы используете .serialize(), вам не нужно будет пытаться разобрать его с другой стороны, он будет иметь данные, эмулирующие данные обычной сериализованной формы.

Лично я бы назвал вашу группу флажков в виде массива,и просто сериализуйте флажки в виде формы.

Форма:

<form id="checkboxes">
    <li><input type="checkbox" name="keywords[]"  value="option1" title="option1" /></li>
    <li><input type="checkbox" name="keywords[]"  value="option2" title="option2" /></li>
    <li><input type="checkbox" name="keywords[]"  value="option3" title="option3" /></li>
    <li><input type="checkbox" name="keywords[]"  value="option4" title="option4" /></li>
    <li><input type="submit" name="submit" class="search" /></li>
</form>

JS:

<script type="text/javascript">
$(document).ready(function(){
    $(".search").click(function()
    {           
        $.post("parser.php", $("form#checkboxes").serialize(), 
        function(data)
        {        
            $.each(data, function()
            {   
                $("div#result").append("<li class='arrow'><a href='parser.php?id=" + this.id + "'>" + this.title + "</a></li>");
            });
            $("div#jsonContent").show();
        });
    });
});
</script>

Затем вам нужно будет обработать $_POST['keywords'] как Array

Вы можете получить к ним доступ с помощью простого foreach

foreach($_POST['keywords'] as $keyword) {
    echo $keyword;
}