Widget all'interno dojo dgrid

Question

La nostra azienda è passata da dojox/DataGrid a dgrid un po 'di tempo fa. Ora stiamo scoprendo, dgrid non sembra supportare i widget dijit/dojox fuori dalla scatola.

dojox/DataGrid ha un formatter() che può restituire un widget. Così facile da fare lì! Il API comparison on GitHub dice

"dgrid supporta le funzioni di formattazione, ma non supporta la restituzione di un widget da loro .dgrid ha anche renderCell, che si prevede di ritorno un nodo DOM. Questo potrebbe apparentemente essere utilizzato per la visualizzazione widget (e il plugin della colonna editor fa esattamente questo.) Notare che per scopi di modifica della cella, l'uso del plug-in dell'editor della colonna è altamente incoraggiato. "

esattamente?

Ho provato a utilizzare il plugin di editor con {editor: ' ', editorArgs:' '}. Questo rende un widget ma è troppo restrittivo. Ad esempio, come faccio a eseguire il rendering di dijit/Button con l'etichetta come valore della cella? O qualcosa di più complesso, come posso usare uno (meno conosciuto) dojox/image/MagnifierLite con un <img> generato da una funzione di formattazione con il valore src del negozio?

Answer 1

È possibile utilizzare questo codice di esempio

require(
    [ 
     "dgrid/List", 
     "dgrid/OnDemandGrid", 
     "dgrid/Selection", 
     "dgrid/editor", 
     "dgrid/Keyboard", 
     "dgrid/tree", 
     "dojo/_base/declare", 
     "dojo/store/JsonRest", 
     "dojo/store/Observable", 
     "dojo/store/Cache", 
     "dojo/store/Memory", 
     "dijit/form/Button", 
     "dojo/domReady!" 
    ], 

    function(
     List, 
     Grid, 
     Selection, 
     editor, 
     Keyboard, 
     tree, 
     declare, 
     JsonRest, 
     Observable, 
     Cache, 
     Memory, 
     Button 
    ) { 

     var columns = [ 
      { 
       label:"Actions", 
       field:"id", 
       width: "200px", 
       renderCell: actionRenderCell 
      } 
     ]; 

     var actionRenderCell = function (object, data, cell) { 

      var btnDelete = new Button({ 
       rowId : object.id, 
       label: "Delete", 
       onClick: function() { 
        myStore.remove(this.rowId); 
       } 
      }, cell.appendChild(document.createElement("div"))); 

      btnDelete._destroyOnRemove = true; 

      return btnDelete; 

     } 

     grid = new (declare([Grid, Selection, Keyboard]))({ 
      store: myStore, 
      getBeforePut: false, 
      columns: columns 
     }, "grid"); 

}