Question

我确定我在这个问题上遗漏了一些非常简单的东西。在将我的头撞到桌子上（字面意思）几天之后，我将自己置于堆栈的怜悯之下：

我在jQGrid中使用jQuery UI Autocomplete作为一个组合框（我知道！我已经在其他地方寻找解决方案但无济于事！）。当我通过jqGrid中的onSelectRow事件访问单元格进行编辑时，我希望打开下拉列表。基本上，我想完成这里讨论的内容：

Open jQuery UI ComboBox on focus

并在此演示：

http://jsfiddle.net/gEuTV/

唯一的区别是我在jqGrid中需要它。我已经尝试了下面的代码，我（错误地）通过会在行聚焦时触发组合框，但组合框不会出现在onSelect事件中的行焦点上。我有一种潜在的怀疑，我只是把下面的代码放在了错误的位置，但我已经尝试过了我能想到的地方：

$("#"+id+"_usr_validation","#list2").bind("focus", function () {
this.value = '';
$(this).autocomplete("search", '');

这是我的完整代码，包括网格：

$(function(){
    var lastsel;
     $("#list2").jqGrid({
            url: 'php_includes/uploadgrid.php',
            datatype: "json",
            mtype: 'GET',
            colNames:[
                    'User Value',
                    'Translated Value',
                    'User Validation,
                    ],
            colModel:[
                    {name:'usr_value',index:'usr_value', sortable:'true', width:60, align:"center", editable:false},
                    {name:'translated_value',index:'translated_value', sortable:'true', width:60, align:"center", editable:false},
                    {name:'usr_validation',index:'usr_validation', sortable:'true', width:60, align:"center", editable:true}
                    ],
            pager: '#pager2',
            rowNum: 1000,
            scroll: true,
            gridview: true,
            viewrecords: false,
            height: 'auto',
            hidegrid: false,
            autowidth: true,
            pgbuttons: false,
            pginput: false,
            forceFit: true,
            emptyrecords: "No record was loaded",
            onSelectRow: function(id){
                            if(id && id==lastsel){
                                    $("#list2").jqGrid('editRow',id,true,autocomp,'','','',selectNone);
                                    } else {
                            if(id && id!==lastsel){
                                    $("#list2").jqGrid('saveRow',lastsel);
                                    $("#list2").jqGrid('editRow',id,true,autocomp,'','','',selectNone);
                                    lastsel=id;
                                    }
                                }
                            },
            editurl: '/php_includes/jqGridCrud.php',
            });
            jQuery("#list2").jqGrid('navGrid',"#pager2",{edit:false, search:false, del:false, add:false})

         function selectNone(){
                     $("#list2").jqGrid('resetSelection');
                    }
                    //this function de-selects all previously accessed rows

            function autocomp(id) {
                    var term2 = $("#list2").jqGrid('getCell',id,'usr_value');
                    $("#"+id+"_usr_validation","#list2")
                            .autocomplete({
                                    source: function(request, response) {
                                              $.ajax({
                                                    url: "/php_includes/Autocomplete.php",
                                                    dataType: "json",
                                                    data: {
                                                            term : request.term,
                                                            term2 : term2,
                                                            },
                                                    success: function(data) {
                                                            response(data);
                                                            }
                                                    });
                                            },
                                    minLength: 0,
                                    select: function(event, ui) {
                                            $("#list2").val(ui.item.id);
                                            },

                            });
             $("#"+id+"_usr_validation","#list2").bind("focus", function () {
                    this.value = '';
                    $(this).autocomplete("search", '');
              });

            }
    });

Answer 1

您应该将'User Validation,更改为'User Validation'，并在代码的不同位置删除尾随逗号（例如来自editurl: '/php_includes/jqGridCrud.php',}并关闭JavaScript中的语法错误，但在很多情况下会被忽略，但是并非所有的网络浏览器。）

更新：还有一个问题是，在调用 oneditfunc之前，对编辑字段的关注将设置为，因此“焦点”事件可以不被触发。作为解决方法，您可以在.bind("focus", ...之后直接触发“焦点”事件。

查看修改过的演示here。

jQGrid + jQueryUI自动完成+组合框在焦点上自动打开

1 个答案: