0

我有一个 JSP 页面，里面有一个表单。

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

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

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

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

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

这几乎就是自动查找的一般工作方式。

问题是当用户尝试从自动查找中选择 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>
4

1 回答 1

0

尝试在您的 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;
}
于 2012-07-09T12:50:52.863 回答