jqGrid自動完成，選擇值並將值複製到另一個單元格

Question

我正在使用Visual Studio 2010 Asp.Net MVC4和jqGrid進行項目。 當部署自動完成和用戶選擇一個值我需要將值複製到另一個單元，因爲我可以做解決這個問題？我附上了圖片和代碼。

這是我的代碼，自動完成的作品，我如何從一個自動完成的價值複製到另一個單元？

jQuery(document).ready(function() { 
    var lastSelection; 
    jQuery("#tbFacturaCompra").jqGrid({ 
     url: '@Url.Action("DatosFacturaCompra", "raFacturaCompra", new { area = "Operacion" })', 
     editurl: '@Url.Action("DatosFacturaCompraABM", "raFacturaCompra", new { area = "Operacion" })', 
     datatype: 'json', 
     mtype: 'POST', 
     postData: { IdOrden: IdOrden, ParTipoOrden: ParTipoOrden }, 
     colNames: ['Del', 'Nit', 'Factura', 'Autorizacion', '', 'Cod. Control', 'Fecha', 'Importe', 'Estado', '', ''], 
     colModel: 
     [ 
      { name: 'ac', width: 15, formatter: 'actions', formatoptions: { keys: true, editformbutton: false, delbutton: true, editbutton: false} }, 
      { name: 'ofc_nit', index: 'ofc_nit', align: 'right', width: '50', editable: true, edittype: 'text', 
       editoptions: { 
        value : '', 
        dataInit: function (elem) { 
         value: ListarProveedores(elem); 
        } 
       } 
      }, 
      { name: 'ofc_nrofac', index: 'ofc_nrofac', align: 'right', width: '50', editable: true, edittype: 'text', editoptions: { style: "text-transform: uppercase"} }, 
      { name: 'ofc_autorizacion', index: 'ofc_autorizacion', align: 'right', width: '50', editable: true, edittype: 'text', editoptions: { style: "text-transform: uppercase"} }, 
      { name: 'ofc_alfanumerico', index: 'ofc_alfanumerico', editable: false, edittype: 'text', hidden: true }, 
      { name: 'ofc_codigocontrol', index: 'ofc_codigocontrol', align: 'right', width: '50', editable: true, edittype: 'text', editoptions: { style: "text-transform: uppercase"} }, 
      { name: 'ofc_fechafactura', index: 'ofc_fechafactura', align: 'center', width: '30', editable: true, formatter: 'date', formatoptions: { srcformat: "d-m-Y", newformat: "d/m/Y"} }, 
      { name: 'ofc_importe', index: 'ofc_importe', align: 'right', width: '25', editable: true, formatter: 'number', formatoptions: { decimalPlaces: 2} }, 
      { name: 'ofc_parestadofaccom', index: 'ofc_parestadofaccom', width: '20', editable: true, edittype: "select", editoptions: { value: "V:V;F:F"} }, 
      { name: 'ofc_partipoorden', index: 'ofc_partipoorden', editable: true, edittype: 'text', hidden: true }, 
      { name: 'ofc_idordenpago', index: 'ofc_idordenpago', editable: true, edittype: 'text', hidden: true } 
     ], 
     pager: '#pg_tbFacturaCompra', 
     rowNum: 15, 
     rowList: [15, 30, 45], 
     sortname: 'ofc_fechafactura', 
     sortorder: 'desc', 
     viewrecords: true, 
     rownumbers: true, 
     imgpath: '/content/themes/base/images', 
     multiselect: false, 
     height: 170, 
     width: 700, 
     footerrow: true, 
     grid: true, 
     toolbar: [true, "top"], 
     loadComplete: function (data) { 
      var id = $.jgrid.randId(); 
      var $grid = $('#tbFacturaCompra'); 
      var mydata = [{ ofc_nit: "", ofc_nrofac: "", ofc_autorizacion: "", ofc_alfanumerico: "-.-", ofc_codigocontrol: "", ofc_fechafactura: FechaServ, ofc_importe: "0.0", ofc_parestadofaccom: "V", ofc_partipoorden: ParTipoOrden, ofc_idordenpago: IdOrden}]; 
      $grid.jqGrid('addRowData', id, mydata[0], "first"); 
      $grid.jqGrid("editRow", id, true, '', '', '', '', reload); 
     }}); 
}); 

UPDATE 奧列格這是包含jQuery用戶界面自動完成代碼： 在返回值 「Autorizacion」 是ID：item.ofr_ultimaauto在自動完成功能 「ListaProveedores」 Autorizacion的」值「item.id 此表單用於快速填充帳單（稅金） 網格不在搜索工具欄中。當從自動完成中選擇值時，如何將id：item.ofr_ultimaauto複製到列「Autorizacion」？

function getData(request, response) { 
    $.ajax({ 
     url: '@Url.Action("BuscaRazonSocial", "raFacturaCompra", new { area = "Operacion" })', 
     type: 'GET', 
     dataType: 'json', 
     data: { term: request.term, maxResult: 20 }, 
     success: function (data) { 
      response($.map(data, function (item) { 
       return { label: item.ofr_nit, value: item.ofr_nit, id: item.ofr_ultimaauto, desc: item.ofr_razon }; 
      })) 
     } 
    }); 
} 
function ListarProveedores(elem) { 
    $(elem).autocomplete({ 
     source: getData, 
     minLength: 5, 
     autosearch: true, 
     select: function (event, ui) { 
     $(elem).val(ui.item.value); 
      $(elem).focus().trigger({ type: 'keypress', charCode: 13 }); 
     } 
    }).data("ui-autocomplete")._renderItem = function (ul, item) { 
     return $("<li>") 
     .append("<a class='ui-menu-item-titulo'><strong>" + item.label + "<br>" + item.desc + " - </strong>" + item.id + "</a>") 
     .appendTo(ul); 
    }; 
} 

Answer 1

你貼不包含jQuery UI的自動完成功能的任何調用的代碼。所以我不能指出你可以擴展的代碼的確切位置。儘管如此，我仍試圖解釋你能做什麼。通常在dataInit內撥打$(elem).autocomplete。 jQuery UI自動完成支持select回調（請參閱here示例），您可以使用它在Autorizacion列中設置新值。對列使用name: 'ofc_autorizacion'。因此，搜索工具欄的輸入字段的id爲gs_ofc_autorizacion，您可以通過$("#gs_ofc_autorizacion").val("5031124051");訪問它。它從服務器返回的jQuery UI自動完成的數據格式爲對象的數組（例如具有屬性value和autorizacion的對象數組），則可以在ui.item中找到相同的屬性。它可以簡化你的代碼。我希望你明白我的意思。

已更新：我看到網格上方的行不是來自搜索工具欄，而是來自內聯編輯。您使用var id = $.jgrid.randId();作爲第一行的ID。所以輸入字段的ID將有id + "_ofc_autorizacion"而不是"gs_ofc_autorizacion"。