Question

我有一个带有表单的JSP页面。

表单包含许多字段，包括文本字段，单选按钮等。

我有一个名为emp id的特殊字段。这是一个文本字段。

此emp id必须长度为9个字符。如果它小于或大于9个字符，那么我需要向用户发出提示消息，即输入的emp id无效。

我编写了一个javascript方法来验证此字段，该字段在此字段的 onchange 事件中触发。

现在，我已将此字段设为自动查找。因此，用户可以输入前几位数字，然后可以看到emp id字段中填充的现有emp列表。

这几乎就是自动lokups的工作原理。

问题是当用户尝试从自动查找中选择emp id时，由于鼠标指针移出文本字段，因此会触发onchange事件。

这是错误的，我希望在从自动查找列表中选择值或手动输入值后触发事件。

请帮忙。

我正在使用jquery自动查找。

下面是我的JSP代码。

    <script>
    $(function() {

        function validateEmpId(empId) {
            empId = $.trim(empId);
            empId = empId.replace(/\s/g, "");
            if (empId.length != 9) {
                alert("Please enter a valid Emp Id.");
            }
        }

        $("#empId")
                .autocomplete(
                        {
                            source : function(request, response) {

                                $.ajax({
                                    url : "${findEmployeesByEmpIdIdUrl}"
                                            + "?t=" + getTimestamp()
                                            + "&hcAsOnDate=" + hcAsOnDate,
                                    datatype : "json",
                                    data : {
                                        dbPrismId : request.term
                                    },
                                    success : function(data) {
                                        response($.map(data, function(item) {
                                            return {
                                                label : item.dbPrismId,
                                                value : item.dbPrismId,
                                                id : item.id + "_"
                                                        + item.forecast
                                            };
                                        }));
                                    }
                                });
                            },
                            minLength : 1,
                            select : function(event, ui) {
                                var employeeId = ui.item.id;


                            },
                            open : function() {
                                $(this).removeClass("ui-corner-all").addClass(
                                        "ui-corner-top");
                            },
                            close : function() {
                                $(this).removeClass("ui-corner-top").addClass(
                                        "ui-corner-all");
                            }
                        });

    });
</script>

<form action="save" method="POST" name="employeeForm" id="employeeForm">
    <input type="text" name="empId" id="empId" maxlength="9" onchange="validateEmpId(this.value);" class="input-txt" />
</form>

Answer 1

尝试在select函数中执行此操作：

select: function(event, ui) {
    if (validateEmpId(ui.item.id)) self.location.href='?site=whatever&id=' + ui.item.id;
    else alert("Please enter a valid Emp Id.");  
}


function validateEmpId(empId) { 
    empId = $.trim(empId); 
    empId = empId.replace(/\s/g, ""); 
    if (empId.length != 9) return false;
    else return true;
}

使用onchange事件验证文本字段？

1 个答案: