将值应用于文本框而不是标签

时间:2012-03-05 03:42:33

标签: jquery jquery-ui autocomplete

@charlietfl即时通讯,我从Asp.Mvc视图返回一个SelectListItem的json集合 以前的数据样本是map操作的结果,ajax返回是:

[  
Object { Selected=false, Text="Guarujá", Value="9182"},  
Object { Selected=false, Text="Jaboticabal", Value="9265"},  
Object { Selected=false, Text="Jacareí", Value="9267"},  
Object { Selected=false, Text="Jandira", Value="9277"},  
Object { Selected=false, Text="Jaú", Value="9285"},  
Object { Selected=false, Text="Jundiaí", Value="9295"}  
]  

我认为自动完成会收到一个数组:{label:“textToShow”,value:“valueToBeKey”} 我返回源事件的每一行中的“对象”是否打破了它? 我现在睡了,但欢迎所有的帮助。 非常感谢

@charlietfl在地图操作之后有一个数据样本返回源事件:

[  
Object { label="Guarujá", value="9182"},  
Object { label="Jaboticabal", value="9265"},  
Object { label="Jacareí", value="9267"},  
Object { label="Jandira", value="9277"},  
Object { label="Jaú", value="9285"},  
Object { label="Jundiaí", value="9295"},  
Object { label="São João da Boa Vista", value="9647"},  
Object { label="São José do Rio Preto", value="9659"},  
Object { label="São José dos Campos", value="9660"}  
]

遇到this问题同样的问题,但解决办法对我不起作用。
有人可以帮帮我吗? 在选择项目jquery后,在我的键/值场景中设置带有值而不带标签的文本框 我发现jquery设置我的文本框的值为:

.menu({
 focus: function( event, ui ) {
    var item = ui.item.data( "item.autocomplete" );
    if ( false !== self._trigger( "focus", event, { item: item } ) ) {
        // use value to match what will end up in the input, if it was a key event
        if ( /^key/.test(event.originalEvent.type) ) {
            self.element.val( item.value );   <<<======  SETTING HERE
        }
    }
 },

这是我的代码:

//-------------------------------------------------
function resetElmntKey(elm) {
    var nmItK = $(elm).attr('data-fielditemid');
    var sltK = $("input[name='" + nmItK + "'][type='hidden']");
    $(sltK).val(0);
}
//-------------------------------------------------
function setupSelection(elm, selIt) {
    if (selIt != undefined) {
        var nmItK = $(elm).attr('data-fielditemid');
        var sltK = $("input[name='" + nmItK + "'][type='hidden']");
        var id = $(elm).attr('id');
        var sltV = "#" + id;
        $(sltK).val(selIt.value);
        $(sltV).val(selIt.label);
    }
}
//-------------------------------------------------
var context = new Array();
function setupView() {
    var elm = $("div[class='editor-field'] :text");
    $.each(elm, function () {
        //-------
        elemento = $(this);
        //-------
        /*
        elemento.keypress(function (event) {
            if (event.keyCode == 13) {
                event.preventDefault();
            }
        });
        */
        //-------            
        elemento.autocomplete({
            source: function (request, response) {
                var elId = $(this.element).attr('id');
                context[elId] = new Array();
                context[elId].elUr = this.element.attr('data-urlactionfind');
                context[elId].elFt = this.element.attr('data-fieldfilterid');
                context[elId].vlFt = $("#" + context[elId].elFt).val();
                context[elId].elVl = this.element.val();
                context[elId].result = null;
                $.ajax
                (
                    {
                        url: context[elId].elUr,
                        dataType: "json",
                        data: { filtro: context[elId].vlFt, fragmento: context[elId].elVl },
                        success: function (data) {
                            context[elId].result = $.map(data, function (item) {
                                return { label: item.Text, value: item.Value }
                            });
                            response(context[elId].result);
                        }
                    }
               )
            },
                select: function (event, ui) {
                resetElmntKey(this);
                var elId = $(this).attr('id');
                setupSelection(this, ui.item);
            },
            focus: function (event, ui) {
                event.preventDefault(); 
                resetElmntKey(this);
                var elId = $(this).attr('id');
                setupSelection(this, ui.item);                    
            }
        }).blur(function (event) {
            event.preventDefault(); 
            resetElmntKey(this);
            var elId = $(this).attr('id');
            if (context[elId].result != undefined) {
                var usrVal = this.value;
                var res = $.grep(context[elId].result, function (selIt, idx) {
                    return $.trim(selIt.label) == $.trim(usrVal);
                });
                if (res != undefined) {
                    setupSelection(this, res[0]);
                }
            }
        });
        //-------
    });
    /*
    elm.keyup(function () {
    var url_busca = $(this).attr('data-urlactionfind');

    alert('[id:' + $(this).attr('id') + ']' +
    '[val:' + $(this).val() + ']' +
    '[urlact:' + $(this).attr('data-urlactionfind') + ']' +
    '[fldFlt:' + $(this).attr('data-fieldfilterid') + ']');
    });
    */
}
function onloadpartial() {
    setupView();
}
//-------------------------------------------------

2 个答案:

答案 0 :(得分:2)

你所需要的只是“返回假”;在事件结束时“选择”和“聚焦”。 当用户键入所有项目而不是选择一项时,您将遇到ID设置问题 很多时候,当用户键入选择的所有项目instad时,将不会完成相关id元素的设置。

答案 1 :(得分:0)

在ajax成功的$.map中,您似乎与名称/值不匹配 你有这个:

 return { label: item.Text, value: item.Value }`

但数据没有密钥Text它应该是Label