Question

我有一个从数据库中读取的jQuery自动完成。

一切都运行良好，但是当我按下回车键时，我需要进入数据库并检查输入的文本是否存在于表中，以便我可以选择它 - 否则我将提醒无效输入。

我的尝试

我实现了source和select方法，并且还实现了文本框的onkeypress方法。我得到了我需要的结果，但即使我按下输入后，自动完成仍然在搜索数据库中的值。

如何停止此操作，因为它会减慢我的页面。

代码：

  $("#<%=txtSearch_Doc.ClientID%>").autocomplete({

            delay:1000,
            source: function (request, response) {
                var m_Subtype = $("#<%=hdn_Subtype_Doc.ClientID%>").val();
                var m_ConSocStr = $("#<%=hdn_ConSocStr_Doc.ClientID%>").val();
                var jsonObjects = { "prefixText": request.term, "m_Subtype": m_Subtype, "m_ConSocStr": m_ConSocStr };
                var jsonString = JSON.stringify(jsonObjects);
                $.ajax({
                    url: '<%=ResolveUrl("AutoCompleteForFile.asmx/AutoSelectDoc")%>',
                    data: jsonString,
                    dataType: "json",
                    delay: 0,
                    autoFocus: true,
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        response($.map(data.d, function (item) {
                            return {
                                label: item.split('|')[0],//show key
                                val: item.split('|')[1], //documentnumber
                            }
                        }))
                    }
                    ,
                    error: function (response) {
                        if (response.responseText != "") {
                            alert(response.responseText);
                        }
                    },
                    failure: function (response) {
                        if (response.responseText != "") {
                            alert(response.responseText);
                        }
                    }
                });
            },
            //begin select event
            select: function (e, i) {
                $("#<%=hdn_Number_Doc.ClientID%>").val(i.item.val);
                $("#<%=txtSearch_Doc.ClientID%>").val(i.item.val.trim());
                if (i.item.val == "") {
                    $("#<%=hdn_Number_Doc.ClientID%>").val("0");
                    $("#<%=txtSearch_Doc.ClientID%>").val("");
                }                   
                return false;
            },
            //end select event
            minLength: 1,               
            autoFocus: false //IF TRUE IT WILL SELECT THE FIRST ROW BY DEFAULT, IF FALSE IT WILL NOT SELECT THE FIRST ROW
        })
            //end autocomplete
            //key press event to handle enter pressed added by chahid on 12-jan-2016
            .keypress(function (e) {
                $("#<%=hdn_key_pressed.ClientID%>").val(e.keyCode);
                if (e.keyCode == 13) {
                    e.preventDefault();
                    var x = $("#<%=txtSearch_Doc.ClientID%>").val();
                    var m_Subtype = $("#<%=hdn_Subtype_Doc.ClientID%>").val();
                    var m_ConSocStr = $("#<%=hdn_ConSocStr_Doc.ClientID%>").val();
                    var jsonObjects = { "prefixText": x, "m_Subtype": m_Subtype, "m_ConSocStr": m_ConSocStr };
                    var jsonString = JSON.stringify(jsonObjects);
                    $("#<%=hdn_is_alert.ClientID%>").val("1");
                    $.ajax({
                        url: '<%=ResolveUrl("AutoCompleteForFile.asmx/CheckForDocExistance")%>',
                        data: jsonString,
                        dataType: "json",
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        success: function (dat) {
                            var json = JSON.stringify(dat);
                            obj = JSON.parse(json);
                            if (obj.d == "2") { // if it is empty
                                $("#<%=txtSearch_Doc.ClientID%>").val("");
                                $("#<%=hdn_Number_Doc.ClientID%>").val("0");
                            }

                            else {
                                if (obj.d.split('|')[0] == "1") {                                        
                                    $("#<%=txtSearch_Doc.ClientID%>").val(obj.d.split('|')[1].trim());
                                    $("#<%=hdn_Number_Doc.ClientID%>").val(obj.d.split('|')[1]);                                                                              
                                    return false;
                                } else {
                                    alert("Invalid input");
                                    $("#<%=txtSearch_Doc.ClientID%>").val("");
                                    $("#<%=txtSearch_Doc.ClientID%>").focus();
                                    $("#<%=hdn_Number_Doc.ClientID%>").val("0");
                                }
                            }
                        },
                        error: function (response) {
                            if (response.responseText != "") {
                                alert(response.responseText);
                            }
                        },
                        failure: function (response) {
                            if (response.responseText != "") {
                                alert(response.responseText);
                            }
                        }
                    });
                    $("#<%=txtSearch_Doc.ClientID%>").autocomplete('close');
                }
            })

Answer 1

好的，我设法找到了一个解决方案：我将搜索事件添加到自动完成中，我在检查keypresscode，并在输入密钥时返回false：

  search: function (event, ui) {
                var key = $("#<%=hdn_key_pressed.ClientID%>").val();                  
                if (key == 13)
                    return false;
                else
                    return true;
            },

Jquery自动完成并输入按键

1 个答案: