具有多重价值的Php Ajax Live Search

时间:2014-08-13 03:01:09

标签: php jquery ajax

我这里有一个Php Ajax Live搜索。我需要做的是添加另一个元素或下拉列表进行搜索。如何在脚本中添加下拉值?

<input type="text" name="value1" id="value1">

<select id="value2" name="value2">
<option value="" selected="selected" disabled>Select an option...</option>
<option value=""></option>
<option value=""></option>
</select>

<div id="result" class="box1"></div>

<script type="text/javascript">
jQuery_1_9_1(document).ready(function () {
    function load(query) {
        jQuery_1_9_1.post('search.php', {
            value1: query
        }, function (search_bid) {

            jQuery_1_9_1('#result').stop(true, true).fadeIn(200).html(search_bid);

        }); //End ajax call
    }

    load(jQuery_1_9_1("#value1").val());
    //Live search
    jQuery_1_9_1("#value1").on('keyup', function () {
        //Input field value
        load(jQuery_1_9_1(this).val());
    }); //End on function
}); //End document.ready state
</script>

的search.php

if(isset($_POST['value1'])) {
$search = $mysqli->real_escape_string($_POST['value1']);
$search = preg_replace("/[^A-Za-z0-9 ]/", '', $search);
$search = $_POST['value1'];
}

1 个答案:

答案 0 :(得分:0)

您只需编辑JS以传递下拉列表值(您会注意到我也做了一些更改以避免重复代码):

<script type="text/javascript">
    function load() {
        jQuery_1_9_1.post('search.php', {
            value1: jQuery_1_9_1('#value1').val(),
            value2: jQuery_1_9_1('#value2').val()
        }, function (search_bid) {

            jQuery_1_9_1('#result').stop(true, true).fadeIn(200).html(search_bid);

        }); //End ajax call
    }

    jQuery_1_9_1(document).ready(function () {
        // Call load function whenever input or select changes
        jQuery_1_9_1("#value1, #value2").on('change', load);

        load();
    }); //End document.ready state
</script>

现在您可以访问search.php

中的两个值
$value1 = $_POST['value1'];
$value2 = $_POST['value2'];