jQuery,使用JSON的自动填充,ID与显示值

前端之家收集整理的这篇文章主要介绍了jQuery,使用JSON的自动填充,ID与显示值 前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我遇到了一个复杂的自动填充问题.这是针对我正在工作的网站的消息传递系统.我希望它可以在您输入用户名的地方使用,它会带回他们的图像,他们的名字和ID的缩略图.然后,当您选择它时,我希望它显示用户名,但是当它回发时,我希望它发回其ID(因为用户名不是唯一的).

我从http://blog.schuager.com/2008/09/jquery-autocomplete-json-apsnet-mvc.html开始.但是,我将Stackoverflow的tageditor.js用作扩展程序,只是因为我喜欢它的工作方式.

标签编辑器链接在下面.我认为它是较旧的版本.

我们正在使用MVC 1.0.这是我的代码

public ActionResult Recipients(string prefix,int limit)
        {
            IList<UserProfile> profiles = profileRepository.GetUsers(prefix,limit);

            var result = from p in profiles
                         select new
                         {
                             p.ProfileId,p.FullName,ImageUrl = GetImageUrl(p)
                         };

            return Json(result);
        }
@H_404_14@

这是页面上的脚本

<script type="text/javascript">
$(document).ready( function() {  
    $('#recipients').autocomplete('<%=Url.Action("Recipients","Filter") %>',{      
        dataType: 'json',parse: function(data) {
            var rows = new Array();          
            for(var i=0; i < data.length; i++) {
                rows[i] = { data: data[i],value: data[i].ProfileId,result: data[i].FullName };
            }          
            return rows;      
        },formatItem: function(row,i,n) {
            return '<table><tr><td valign="top"><img src="' + row.ImageUrl + '" /></td><td valign="top">' + row.FullName + '</td></tr></table>';
        },max: 20,highlightItem: true,multiple: true,multipleSeparator: ";",matchContains: true,scroll: true,scrollHeight: 300
     });
});
</script>
@H_404_14@

因此,发生的事情是回叫有效,我的列表显示了图像和用户名,当我选择一个时,它将用户的全名放在带有斜线符的文本框中.但是,当我提交表单时,只会发送回名称,而不发送个人资料ID.关于如何在不显示ID的情况下获取ID的任何想法?

编辑:
这是我正在使用http://www.gotroleplay.com/scripts/tageditor.js的tageditor.js的版本

最佳答案
我知道这很la脚,但我总是(a)从结果处理程序中发布数据(不是formatResult,据我所知,它只是格式化结果以放入文本框,或者(b)将值粘贴到隐藏字段-同样来自结果处理程序-用于发布.

    $('#recipients').autocomplete({options})
     .result(function(event,data,formatted) {
         $("#hidden_field").val( data.ProfileId );
// or just post the data from in here...
    });
@H_404_14@

或者其他的东西.如果您找到更好的方法,请告诉我们…

显然,直接从自动完成“结果”中发布仅适用于非常特定的情况

原文链接:https://www.f2er.com/jquery/530972.html

猜你在找的jQuery相关文章