使AJAX与自动完成文本框一起使用

时间:2014-04-03 09:47:38

标签: php mysql ajax

所以我真的坚持使用我正在处理的这段代码。我想为使用Ajax自动完成页面的文本框创建一个函数,并使用数据库中的数据在页面上显示结果。这已经有效但只有复选框。因此,当选中文本框时,页面将通过AJAX获取更新,结果将显示在屏幕上。

现在,当您输入内容时,我希望文本框也一样。文本框具有自动完成功能,当您从列表中选择项目时,它应该使用结果更新页面。这是我原来的复选框AJAX代码,但是我无法弄清楚如何将它用于文本框部分。

任何帮助都将不胜感激。

AJAX:

function makeTable(data) {
    var tbl_body = "";
    $.each(data, function() {
        var tbl_row = "";
        $.each(this, function(k , v) {
            tbl_row += "<td>"+v+"</td>";
        })
        tbl_body += "<tr>"+tbl_row+"</tr>";
    })
    return tbl_body;
}

function getEmployeeFilterOptions(){
    var opts = [];
    $checkboxes.each(function(){
        if(this.checked){
            opts.push(this.name);
        }
    });
    return opts;
}

function getEmployeeFilterOptions2(){
    var opts = [];
    $onchange.each(function(){
        if(this.checked){
            opts.push(this.name);
        }
    });

    return opts;
}

function updateEmployees(opts){
    $.ajax({
        type: "POST",
        url: "submit.php",
        dataType : 'json',
        cache: false,
        data: {filterOpts: opts},
        success: function(records){
            $('#employees tbody').html(makeTable(records));
        }
    });
}

var $checkboxes = $("input:checkbox");
$checkboxes.on("change", function(){
    var opts = getEmployeeFilterOptions();
    updateEmployees(opts);
});

updateEmployees();

0 个答案:

没有答案