【问题标题】:Jquery Autocomplete Select Event get json objectjQuery自动完成选择事件获取json对象
【发布时间】:2014-01-08 03:02:38
【问题描述】:

您好,我有一个实现 jquery 自动完成的文本字段。一切都很好。

我现在需要的是在“选择”事件中我希望能够读取项目 json 对象。目前唯一可用的两个属性是“label”和“value”。

代码如下:

$( "#txtfatherslast" ).autocomplete({
            source: function( request, response ) {
                $.ajax({
                    url: '@Url.Content("~/Home/SearchVisitor")/',
                    type: 'POST',
                    contentType: 'application/json',
                    dataType: "json",
                    data: JSON.stringify(
                     {
                         fathersLast: "",
                         mothersLast: "",
                         firstName: ""

                     }),
                    success: function( data ) {
                        response( $.map( data.results, function( item ) {
                            return {
                                label: item.FathersLast + " " + item.MothersLast + ", " + item.FirstName + " (" + item.OrganizationName + ")", 
                                value: item.FathersLast
                            }
                        }));
                    }
                });
            },
            minLength: 3,
            select: function( event, ui ) {
                alert(ui.item.label); // here I would like to get item.FathersLast etc...
            },
            open: function() {
                $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
            },
            close: function() {
                $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
            }
        });

所以 Select 事件:

 ....
    minLength: 3,
                select: function( event, ui ) {

// here i want to be able to read item.FathersLast or item.MothersLast.. is that possible?                    

alert(ui.item.label);

                },
    ...

关于如何在 Selected 事件中获取 json 对象属性的任何线索?

谢谢

【问题讨论】:

    标签: jquery json jquery-ui jquery-autocomplete jquery-ui-autocomplete


    【解决方案1】:

    当您填充自动完成时,您只需在来自响应的对象中添加您希望检索的属性,例如使用来自 JSON obj 的属性值:

    source: function( request, response ) {
                $.ajax({
                    url: '@Url.Content("~/Home/SearchVisitor")/',
                    type: 'POST',
                    contentType: 'application/json',
                    dataType: "json",
                    data: JSON.stringify(
                     {
                         fathersLast: "",
                         mothersLast: "",
                         firstName: ""
    
                     }),
                    success: function( data ) {
                        response( $.map( data.results, function( item ) {
                            return {
                                label: item.FathersLast + " " + item.MothersLast + ", " + item.FirstName + " (" + item.OrganizationName + ")", 
                                value: item.FathersLast,
                                /* edits */
                                fathersLast : item.FathersLast, //access as ui.item.fathersLast
                                mothersLast: item.MothersLast, //access as ui.item.mothersLast, etc [...]
                                firstName : item.FirstName,
                                organizationName : item.OrganizationName
                                //[...]
                            }
                        }));
                    }
                });
            }
    

    【讨论】:

      猜你喜欢
      • 2011-12-05
      • 2014-11-19
      • 2012-09-25
      • 2017-02-16
      • 2021-04-08
      • 2014-05-09
      • 2018-10-11
      • 1970-01-01
      • 2020-02-17
      相关资源
      最近更新 更多