【问题标题】:Value is applied instead of label to textbox将值而不是标签应用于文本框
【发布时间】:2012-03-22 14:42:49
【问题描述】:

@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 map 操作后有一个数据样本返回到源事件:

[  
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();
}
//-------------------------------------------------

【问题讨论】:

标签: jquery jquery-ui autocomplete


【解决方案1】:

你只需要输入“return false;”在事件“选择”和“焦点”结束时。
当用户键入所有项目而不是选择一个项目时,您将遇到 ID 设置问题。
很多时候,当用户在 select one 中键入所有 item 时,相关 id 元素的设置将不会完成。

【讨论】:

  • 谢谢,真的解决了。关于 id 设置,你是对的,很多时候,主要是在快速键入并退出时,结果变量上没有数据可以查找一个相等然后函数不设置 id,我将打开另一个关于它的问题,谢谢你也给我指出。
【解决方案2】:

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

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

但是数据没有键Text应该是Label

【讨论】:

  • 非常感谢,但我想我不清楚,我对我的问题的评论。非常感谢您的时间和帮助。
猜你喜欢
  • 2011-11-30
  • 2016-04-16
  • 2019-12-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-05-13
  • 1970-01-01
相关资源
最近更新 更多