使用单选按钮ajax搜索功能

时间:2015-05-27 20:17:31

标签: php jquery html mysql ajax

我的jquery有问题。我不是百分之百确定为什么它不起作用。所以我需要一些帮助来找出错误以及如何解决它。

这应该用于搜索功能,以便从游戏中搜索竞技场队伍的数据库。如果我只从搜索框中选择值,代码确实可以正常工作。但是当我使用搜索框和单选按钮时它不起作用

这是我的HTML代码

<form action="#" method="POST">
            <input type="search" name="itemname" id="searchbar" placeholder="Search Arena Team" class="first"><br>
            <label for="two">2v2</label>
            <input type="radio" name="type" id="two" class="type" value="2"><br>
            <label for="three">3v3</label>
            <input type="radio" name="type" id="three" class="type" value="3"><br>
            <label for="five">5v5</label>
            <input type="radio" name="type" id="five" class="type" value="5"><br>
            <input type="submit" value="Search !">
        </form>
    </div>
    <div id="content">
        <table id="searchResult">
            <tr class="tablerow">
                <th>Team Name</th>
                <th>Team Rating</th>
                <th>Team Rank</th>
            </tr>
        </table>

这是我的jQuery

            $(document).ready(function() {

                var showResult = function(data) {
                    $('#searchResult td').parent().remove();
                    $.each(data, function(index, info) {
                        $('#searchResult tr:last').after(
                            '<tr class="tablerow">' +
                                '<td>' + info['name'] + '</td>' +
                                '<td>' + info['rating']  + '</td>' +
                                '<td>' + info['rank'] + '</td>' +
                            '</tr>'
                        );
                    });
                };

                $('#searchbar').on('input', function() {

                    $.get('functions/arenasearch.php', { 
                        name: $(this).val()
                    },
                    showResult).fail(function() {

                    });

                });

                $('.type').on('change', function() {

                    $.get('functions/arenasearch.php', { 
                        type: $(this).val()
                    },

                    showResult).fail(function() {

                    });
                });

            });

由于某种原因,我无法发布我的PHP脚本,所以我上传到pastebin http://pastebin.com/CrCMpVXG

1 个答案:

答案 0 :(得分:1)

正如评论中提到的那样,您应该传递这两个值,您可以在一个查询中将要发送的两个值组合到搜索脚本中。类似的东西:

$('#searchbar').on('input', function () {
    search();
});

$('.type').on('change', function () {
    search();
});

function search() {
    $.get('functions/arenasearch.php', {
        name: $('#searchbar').val(),
        type: $('.type:checked').val()
    }, showResult).fail(function() {

    });
}