Сигурен съм, че пропускам нещо много просто в това. След като си блъсках главата в бюрото (буквално) от няколко дни, се предавам на милостта на стека:
Използвам jQuery UI Autocomplete като падащ списък в моя jQGrid (знам! Вече потърсих решението другаде без резултат!). Бих искал падащото меню да се отваря, когато имам достъп до клетката за редактиране чрез събитието onSelectRow в jqGrid. По принцип искам да направя точно това, което се обсъжда тук:
Отворете jQuery UI ComboBox на фокус
и демо тук:
Единствената разлика е, че имам нужда от него в 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", '');
});
}
});