2013-08-23 43 views
0

我正在使用Visual Studio 2010 Asp.Net MVC4和jqGrid进行项目。 当部署自动完成和用户选择一个值我需要将值复制到另一个单元,因为我可以做解决这个问题?我附上了图片和代码。 enter image description herejqGrid自动完成,选择值并将值复制到另一个单元格

这是我的代码,自动完成的作品,我如何从一个自动完成的价值复制到另一个单元?

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); 
    }; 
} 

回答

0

你贴不包含jQuery UI的自动完成功能的任何调用的代码。所以我不能指出你可以扩展的代码的确切位置。尽管如此,我仍试图解释你能做什么。通常在dataInit内拨打$(elem).autocomplete。 jQuery UI自动完成支持select回调(请参阅here示例),您可以使用它在Autorizacion列中设置新值。对列使用name: 'ofc_autorizacion'。因此,搜索工具栏的输入字段的idgs_ofc_autorizacion,您可以通过$("#gs_ofc_autorizacion").val("5031124051");访问它。它从服务器返回的jQuery UI自动完成的数据格式为对象的数组(例如具有属性valueautorizacion的对象数组),则可以在ui.item中找到相同的属性。它可以简化你的代码。我希望你明白我的意思。

已更新:我看到网格上方的行不是来自搜索工具栏,而是来自内联编辑。您使用var id = $.jgrid.randId();作为第一行的ID。所以输入字段的ID将有id + "_ofc_autorizacion"而不是"gs_ofc_autorizacion"

+0

我已经用代码自动完成更新了我的问题,希望你能帮助我? – raranibar

+0

@raranibar:因为'ofc_autorizacion'列有'editable:true'属性,所以可编辑的行应该包含''(其中123是rowid你可以在自动完成的'select'回调中找到'$(elem).closest(“tr”)。attr(“id”)')。所以你可以将你的'select'回调修改为以下'select:function(event,ui){$(elem).val(ui.item.value); $(ELEM).closest( “TR”)找到( “输入[名称= ofc_autorizacion]”)VAL(ui.item.id)。; $(elem).focus()。trigger({type:“keypress”,charCode:13}); }' – Oleg

+0

谢谢我可以通过您的解决方案解决我的问题。 – raranibar

相关问题