2011-12-13 13 views
7

Próbuję stworzyć jakąś wielokrotnego użytku formater na kolumnie jqGrid, Chciałbym utworzyć niestandardową formatowania gdzie jestem w stanie przekazać dodatkowe dane, coś podobnego do tego kodu:Jak przekazać dodatkowe zmienne do formatera jqGrid?

function imageLinkFormatter(cellval,options,rowObject,icon,link_class,link_action){ 
    var img='<span class="ui-icon '+icon+' icon"><span/>';  
    var link='<a href="#'+link_action+'/id/'+rowObject.id+'" class="'+link_class+'" rel="'+rowObject.id+'">'+img+'</a>'; 
    return link; 
    } 

Odpowiedz

10

to chyba nieporozumienie. Interfejs custom formatter jest zdefiniowany przez jqGrid. Aby mieć dodatkowe parametry w edytorze niestandardowym, należy zmodyfikować kod źródłowy jqGrid.

Dobrą wiadomością jest to, że tak naprawdę nie trzeba rozszerzać standardowego formatyzatora standardowego. Zamiast tego prawdopodobnie chcesz po prostu udostępnić kod. Więc można zdefiniować jako wspólny kod funkcji jak

function imageLinkFormatter(cellval, options, rowObject, icon, link_class, link_action) { 
    var img = '<span class="ui-icon ' + icon + ' icon"><span/>';  
    var link = '<a href="#' + link_action + '/id/' + rowObject.id + '" class="' + 
     link_class + '" rel="' + rowObject.id + '">' + img + '</a>'; 
    return link; 
} 

i wywołać funkcję z niestandardowym formater poszczególnych kolumn siatki z dodatkowymi parametrami.

colModal: [ 
    {name: 'col1', formatter: function (cellvalue, options, rowObject) { 
      return imageLinkFormatter(cellvalue, options, rowObject, 
       'ui-icon-pencil', 'edit-link-class', 'Edit'); 
     }}, 
    {name: 'col2', formatter: function (cellvalue, options, rowObject) { 
      return imageLinkFormatter(cellvalue, options, rowObject, 
       'ui-icon-plus', 'add-link-class', 'Add'); 
     }}, 
    {name: 'col2', formatter: function (cellvalue, options, rowObject) { 
      return imageLinkFormatter(cellvalue, options, rowObject, 
       'ui-icon-trash', 'del-link-class', 'Delete'); 
     }}, 
    ... 
] 

Czy tego chcesz?

+0

Dzięki za odpowiedź i wyjaśnienie, pomyślałem, że muszę przedłużyć niestandardowego formatowania, ale to jest idealne rozwiązanie. Pozdrawiam – stawek

+0

@stawek: Nie ma za co! – Oleg

6

określić formatoptions w definicji kolumny

colModal: [ 
    {name: 'col1', 
    formatter: imageLinkFormatter, 
    formatoptions: { 
     icon: 'ui-icon-pencil', 
     link_class: 'edit-link-class', 
     action: 'Edit' 
    }}, 
    {name: 'col2', formatter: imageLinkFormatter, formatoptions: {icon: 'ui-icon-plus', link_class: 'add-link-class', action: 'Add'}}, 
    {name: 'col3', formatter: imageLinkFormatter, formatoptions: {icon: 'ui-icon-trash', link_class: 'del-link-class', action: 'Add'}} 
    ... 
] 

a następnie można go wewnątrz niestandardowego formater

function imageLinkFormatter(cellval, options, rowObject) { 
    var img = '<span class="ui-icon ' + options.colModel.formatoptions.icon + ' icon"><span/>'; 
    var link = '<a href="#' + options.colModel.formatoptions.action + '/id/' + rowObject.id + '" class="' + 
     options.colModel.formatoptions.link_class + '" rel="' + rowObject.id + '">' + img + '</a>'; 
    return link; 
} 
Powiązane problemy