Question

我有一个自动填充文本框，在该文本框中获取员工姓名。如果我点击该特定员工姓名，该特定员工的详细信息，如照片，姓名，身份证，联系人，这些类型的详细信息应该作为一个盒子容器添加（就像我们的stackoverflow中的标签框一样），就像这个多少员工的名字一样点击它们，应该在该文本框下方添加大量记录，我该怎么做，以及我必须使用哪个工具，任何人都可以帮助我

function searchEmployees() {

$("#txtEmployee").autocomplete({

    source: function (request, response) {
        $.ajax({
            type: "POST",
            url: "/DataService.asmx/SearchEmployees",
            contentType: "application/json; charset=utf-8",
            data: "{'searchTerm' : '" + $("#txtEmployee").val() + "'}",
            dataType: "json",
            success: function (data) {
                var s = jQuery.parseJSON(data.d);
                var i = 0;
                var css = "";

                if (s != null) {

                    response($.map(s, function (item) {
                        i++;
                        if (i == s.length) {
                            css = "autocompletetablenoborder";
                        }
                        else {
                            css = "autocompletetable";
                        }
                        return {

                            label: "<table class='" + css + "'><tr><td rowspan='4' width='50px;'><img src='" + item.Photo + "' Width='48' Height='48'  /></td><td>" + item.Name + " ( " + item.USN + " )</td></tr><tr><td><table cellpadding='0' cellspacing='0'><tr><td>" + item.Email + "</td><td>&nbsp;|&nbsp;</td><td>" + item.Mobile + "</td></tr></table></td></tr></table></td></tr></table>",
                            name: item.Name

                        }
                    }));
                }
                else {
                    return null;
                }

            },
            error: function (req, status, error) {
                alert("ERROR:" + error.toString() + " " + status + " " + req);

            }
        });
    },
    minLength: 1,

    select: function (event, ui) {
        $("#Employee").val(ui.item.name);
        return false;
    }
});

} 在这里你可以看到我试图添加员工姓名（实际上我需要显示员工形象，联系人号码，身份证......但仅仅是试用我试图绑定姓名）在div中，我们选择了一个特定的员工自动完成列表，但它不起作用，任何人都可以找到问题

Answer 1

如果您使用jQuery UI进行自动完成输入 - 当用户点击列表并选择其中一个时，会在字段上显示特殊事件 - http://jqueryui.com/demos/autocomplete/#event-select

使用jquery添加更多的记录

1 个答案: