AJAX实时搜索使用单选按钮

Question

I'm able to get jQuery AJAX live search working on an input field and it returns the desired result that I want. for example : Search for my word returns the desired result .

But Now I want to do a compound search on two fields. for example : Search for the word + today or Search for the word + tomorrow This is what I have but it is not working or does not returning any errors.

index.php

<form>
        <input placeholder="Search the area" class="input-large search-query" type="text" id="key">
        <input type="radio" name="b_selected" class="radio" value="1"  > Today
        <input type="radio" name="b_selected" class="radio"  value="2"  > Tomorrow<br>
            <div class="result"><div class="loading"></div></div>
            </form> 

quicksearch.php

include('config.php');
$count= 0;
 if(isset($_POST["b_selected"]))
      {  $b_selected =  $_POST['b_selected'];   }

$key =  $_POST['key'];
$b_selected =  $_POST['b_selected'];

$key = addslashes($key);
$sql = mysql_query("select * from account WHERE b_today='1' and title LIKE '%$key%'  ") or die(mysql_error());

    While($row = mysql_fetch_array($sql)) {
    $count++;
    $id= $row['id'];
    $title=$row['title'];

    if($count<= 10){

search.js

 /*quick search*/

                $(document).ready( function() {
                            $(".result").hide();

                $("#key").keyup( function(event){
                    var key = $("#key").val();

                    if( key != 0){
                        $.ajax({
                        type: "POST",
                        data:{ key: key },
                        url:"quicksearch.php",
                        success: function(response) {
                        $(".result").slideDown().html(response);
                        }
                        })

                        }else{

                        $(".result").slideUp();
                        $(".result").val("");
                        }
                 })

                })

                /* Search for work plan for today or Tomorrow*/

                   $(document).ready(function(){
                      $('input[type="radio"]').click(function(){
                           var b_selected = $(this).val();
                           $.ajax({
                                url:"quicksearch.php",
                                method:"POST",
                                data:{b_selected:b_selected},
                                success:function(data){
                                     $('#result').html(data);
                                }
                           });
                      });


});

Answer 1

You should POST both variables - the word plus the value of the radio-button. If you POST only the word or only the radio-button - you won't get what you want:

$(document).ready( function() 
{
    $(".result").hide();

    /*quick search*/
    $("#key").keyup( function()
    {
    var key = $(this).val();
    var b_selected = $('input[type="radio"]').val();

    $.ajax({
      method: "POST",
      url: "quicksearch.php",
      data:
            { 
                key: key,
                b_selected: b_selected
            },
      success: function(response) 
      {
        $(".result").slideDown().html(response);
      }
    });
    });

    /* Search for work plan for today or Tomorrow*/
  $('input[type="radio"]').click(function()
    {
     var key = $('#key').val();
     var b_selected = $(this).val();

     $.ajax({
        method: "POST",
        url: "quicksearch.php",
        data:
                {
                    key: key,
                    b_selected: b_selected
                },
        success: function(response)
                {
           $('#result').slideDown().html(response);
        }
     });
  });
})