0

我正在使用 jquery 自动完成。我有这个要求,用户在文本框中键入并出现一个下拉列表,其中显示包含该字符的员工姓名,并且当他们键入时,列表变得更加简洁。

当用户选择员工时,其 emp_id、emp_email 等将被发送到控制器进行进一步处理。

此员工信息存储在 Hashmap 中,如下所示:

// 001 is emp id, Aaron Gonsalves is the display name 
and Aaron@email.com is the email id

empMap("1","001:Aaron Gonsalves:Aaron@email.com");    
empMap("2","002:Abraham Gonsalves:Abraham@email.com");
empMap("3","003:Ackon Gonsalves:Ackon@email.com");

我知道 jquery 支持键值对,但为此我必须使用 json(我猜是这样)来获取信息并将其发送到自动完成。无论如何,我不能在我的项目中使用 json。

对于 UI,我正在使用以下代码

 // This logic is working fine when <%=empMap> 
 // contains data like "Aaron Gonsalves,Abraham Gonsalves,Ackon Gonsalves"
 $(document).ready(function(){
     var data = "<%=empMap>".split(","); 
     $("#example").autocomplete(data);  // #example is my text box id
 });

是否有任何方法可以根据“:”在内部拆分数据并在我的下拉列表中显示 emp_name 并通过隐藏字段将 emp_id 和电子邮件发送到控制器?

请帮我一些代码,我是 jquery 的新手,我对它的了解很少。

为了您的信息,我正在使用 Weblogic Workshop 8.1、JPF 框架(类似于 Struts)、JDK 1.4

4

1 回答 1

0

如果您将其转换为 JSON,它会容易得多。我了解您不想从服务器发送 json 对象,但您可以在客户端将地图(或任何数据结构)转换为 json。

您的问题的工作代码:DEMO JSFiddle

Javascript:

<script>
$(document).ready(function() {
    var dataFromJava = "{3=003:Ackon Gonsalves:Ackon@email.com, 2=002:Abraham Gonsalves:Abraham@email.com, 1=001:Aaron Gonsalves:Aaron@email.com}";
    parseMap(dataFromJava);
    var data = parseMap(dataFromJava);
    $("#example").autocomplete({
        source: data,
        select: function(event, ui) {
            $("#example").val(ui.item.label);
            $("#emp_id").val(ui.item.value);
            $("#email").val(ui.item.email);

            return false;
        },
        change: function(event, ui) {
            $("#emp_id").val('');
            $("#email").val('');
        }
    });
});

function parseMap(data) {
    //Remove { and }
    data = data.substring(1, data.length - 1);
    var rows = data.split(',');
    var result = new Array();
    for (i = 0; i < rows.length; i++) {
        var value = rows[i].split("=")[1];
        var variables = value.split(":");
        result[i] = {};
        result[i]['value'] = variables[0];
        result[i]['label'] = variables[1];
        result[i]['email'] = variables[2];
    }
    return result;
}​
function submitValue() {

    var name = $("#example").val();
    var id = $("#emp_id").val();
    var email = $("#email").val();

    alert(id + ":" + name + ":" + email);
}
</script>​

还使用最新版本的 Jquery 和 Jquery-UI(或 Jquery 自动完成)插件..

于 2012-09-30T07:21:14.360 回答