0
이 질문과 관련하여이 질문과 관련하여 여러 가지 대답이 있지만 불행히도 모두 오래된 것으로 보입니다. jqGrid는 최근에 v 4.x. 또한 편집과 추가를 구현하는 여러 가지 방법이 있으므로 두 가지 상황이 동일하지 않은 것으로 보입니다. 따라서이 질문을 특정 코드로 다시 게시하고 구체적인 답변을 요청해야합니다.jqGrid 4.x 인라인 편집을 사용하여 단일 필드에서 자동 완성을 구현하려고 시도합니다.
기본적으로 인라인을 편집 할 수 있고 autocomplete을 사용하여 하나의 필드에 select 메서드를 기반으로 다른 두 필드를 채우려는 거의 동일한 3 개의 그리드가 있습니다. oneditfunc
var mmGrid = $('#orderMMGrid'),
editingRowId,
myEditParam = {
keys: true,
oneditfunc: function(id) {
editingRowId = id;
alert('#' + id + '_mastec_partno');
$('#' + id + '_mastec_partno').autocomplete({
source: function(request, response) {
$.getJSON('/json/json.searchmultiMaterials.php',{term:request.term,type:'m'},function(data) {
response(data);
})
},
minLength: 2,
select: function(e,ui) {
$(e).val(ui.item.id);
$('input[name="description"]').text(ui.item.description);
$('input[name="vendor_id"]').val(ui.item.vendor_id);
return false;
}
});
},
afterrestorefunc: function(id) {
editingRowId = undefined;
}
},
myAddParam = {
rowID: 'new',
position:'last',
extraparam: {
ml_id: ml_id
}
};
인라인 편집에 autocomplete와
** 원본 코드 **
var mmGrid = $('#orderMMGrid'),
editingRowId,
myEditParam = {
keys: false,
oneditfunc: function(id) {
editingRowId = id;
// have tried autocomplete here as well //
},
afterrestorefunc: function(id) {
editingRowId = undefined;
},
extraparam: {
ml_id: ml_id
}
},
myAddParam = {
rowID: 'new',
position:'last',
extraparam: {
ml_id: ml_id
}
};
mmGrid.jqGrid({
url: '/json/json.getMinorMaterialsOrder.php?ml_id=' + ml_id,
datatype:'json',
colNames: ['ID','Type','Supp','Vendor','PO#','MasTec Part#','Description','Ship Date','Qty Ord','Rcvd Date','Qty Rec','Material Manager Notes','Receiving Clerk Notes'],
colModel: [
{ name:'id',
index:'id',
hidden:true,
key:false,
search:false,
viewable:false
},
{ name:'type',
index:'type',
width:40,
sortable:false,
editable:false,
align:'center',
editoptions:{defaultValue:'M'}
},
{ name:'supp',
index:'supp',
width:40,
sortable:false,
editable:false,
align:'center',
editoptions:{defaultValue:suppno}
},
{ name:'vendor_id',
index:'o.vendor_id',
width:75,
sortable:true,
sorttype:'text',
align:'left',
editable:true,
classes:'ui-ellipsis',
edittype:'select',
editoptions:{dataUrl:'/jqg/jqg.selVendors.php'},
editrules:{required:true}
},
{ name:'order_number',
index:'order_number',
width:55,
sortable:false,
editable:true,
classes:'ui-ellipsis',
align:'center'
},
{ name:'mastec_partno',
index:'mastec_partno',
width:120,
sortable:false,
editable:true,
classes:'ui-ellipsis',
edittype:'text',
editoptions:{size:22},
editrules:{required:true},
searchoptions: {
dataInit: function(e) {
$(e).autocomplete({
source: allMinorMaterials,
minLength: 2,
select: function(e,ui) {
e.val(ui.item.id);
$('input[name="description"]').text(ui.item.description);
$('input[name="vendor_id"]').val(ui.item.vendor_id);
return false;
}
});
}
}
},
{ name:'description',
index:'description',
width:180,
sortable:false,
align:'left',
editable:true,
classes:'ui-ellipsis',
edittype:'text',
editoptions:{size:33},
editrules:{required:true}
},
{ name:'ship_date',
index:'o.ship_date',
width:85,
sortable:true,
sorttype:'date',
editable:true,
align:'center',
editrules:{required:true},
editoptions:{ size:15,
dataInit: function(l) {
$(l).datepicker({dateFormat:'yy-mm-dd'});
}
}
},
{ name:'qty_ordered',
index:'qty_ordered',
width:55,
sortable:false,
editable:true,
align:'center',
classes:'qtyOrd',
editrules:{required:true},
editoptions:{size:6}
},
{ name:'rcvd_date',
index:'o.rcvd_date',
width:85,
sortable:true,
sorttype:'date',
editable:true,
align:'center',
editoptions:{ size:15,
dataInit:function(l) {
$(l).datepicker({dateFormat:'yy-mm-dd'});
}
}
},
{ name:'qty_received',
index:'qty_received',
width:55,
sortable:false,
editable:true,
align:'center',
classes:'qtyRec',
editoptions:{size:6}
},
{ name:'mm_notes',
index:'mm_notes',
width:250,
sortable:false,
editable:true,
edittype:'textarea',
classes:'ui-ellipsis',
editoptions:{rows:'3',cols:'45'}
},
{ name:'rc_notes',
index:'rc_notes',
width:250,
sortable:false,
editable:true,
edittype:'textarea',
classes:'ui-ellipsis',
editoptions:{rows:'3',cols:'45'}
}
],
pager:'#orderMMFoot',
sortname:'o.id',
caption:'Minor Materials Ordered for ' + ml_name,
gridComplete: function() {
$('.jqgrow').each(function(i) {
var ordqty = $(this).find('td.qtyOrd').text();
var ordrec = $(this).find('td.qtyRec').text();
if ((+ordqty == +ordrec) && (ordrec !== null) && (ordrec != 'undefined')) {
$(this).find('td.qtyRec').addClass('complete');
} else {
$(this).find('td.qtyRec').addClass('incomplete');
};
});
},
afterSaveCell: function(rowid) {
var jqRow = $('tr#' + rowid);
var ordqty = jqRow.find('td.qtyOrd').text();
var ordrec = jqRow.find('td.qtyRec').text();
if ((+ordqty == +ordrec) && (ordrec !== null) && (ordrec != 'undefined')) {
jqRow.find('td.qtyRec').addClass('complete');
} else {
jqRow.find('td.qtyRec').addClass('incomplete');
};
},
onSelectRow: function(id) {
if(id && id !== lastSel) {
mmGrid.jqGrid('restoreRow',lastSel);
mmGrid.jqGrid('editRow',id,true);
lastSel = id;
}
},
editurl:'/jqg/jqg.saveMinorMaterialEdit.php'
});
mmGrid.jqGrid('navGrid','#orderMMFoot',{add:false,edit:false,del:true});
mmGrid.jqGrid('inlineNav','#orderMMFoot',{add:true,edit:true,del:true,editParams:myEditParam,addParams:{addRowParams:myAddParam}});
옵션 코드가 작동하는 것 같군. extraParams가 작동 중입니다. 자동 완성은 아닙니다.
인라인 편집 동안 필드 내에 생성되는 #inner-editor 요소가 문제 중 하나입니다. 여러 게시 된 답변/예에 따라
autocomplete에서 SearchOptions는 검색 및 oneditfunc 을 시도했습니다. mastec_partno은 autocomplete이되어야 올바른 값을 다른 두 필드에 배치 할 수 있습니다.