2013-08-21 21 views
14

Mi piacerebbe essere in grado di modificare il testo delle intestazioni di colonna in un Handsontable ma non riesco a capire se è possibile renderli modificabili. Suppongo che potrei fare le intestazioni solo un'altra riga, ma vorrei evitarlo, se possibile.Come posso modificare il testo dell'intestazione di un Handstable?

per chiarire: In realtà sto cercando un modo per consentire all'utente di modificare i valori di intestazione (come sarebbero una normale cella di una tabella

+2

Perché si sta cercando di evitare di avere loro di essere cellule normali? Dovresti essere in grado di usare i CSS per modellarli come preferisci in modo che appaiano diversi dalle altre celle. – alxndr

+0

@alxndr, sì, sembra che sia il modo di farlo, dopo tutto. Detto questo, sarebbe bello se la modifica del contenuto dell'intestazione fosse supportata. – ksigmund

risposta

3

Nel campione Backbone (http://handsontable.com/demo/backbone.html), che forse mostrano ciò che sei ricerca:

var $container = $("#example1"); 
$container.handsontable({ 
    data: cars, 
    dataSchema: makeCar, 
    contextMenu: true, 
    columns: [ 
    attr("make"), 
    attr("model"), 
    attr("year") 
    ], 
    colHeaders: ["Make", "Model", "Year"] 
    //minSpareRows: 1 //see notes on the left for `minSpareRows` 
}); 
+4

Grazie per la risposta. In realtà sto cercando un modo per consentire all'utente di modificare i valori di intestazione (come farebbe una normale cella di tabella). – ksigmund

17

Questo è probabilmente troppo tardi per OP, ma chiunque altro cercando la stessa risposta è possibile modificare le intestazioni delle colonne (così come altre impostazioni) dopo la tabella è già stato reso con il seguente:

var hot = $container.data('handsontable'); 
hot.updateSettings({ 
    colHeaders: ['A','B','C'] 
}); 

Per quanto posso dire, è possibile passare qualsiasi impostazione disponibile nel costruttore.

+1

Credo che questo fornisca solo la capacità di fare ciò che stavo cercando di fare in modo programmatico, invece di lasciare che la cella stessa sia direttamente modificabile. – ksigmund

+1

@srxf Non è perché non risponde alla domanda OP. Stava cercando un modo per consentire * all'utente * di modificare l'intestazione del tavolo come una cella. Non nel codice. Questa è una buona risposta, ma è comunque una risposta ad un'altra domanda. – fab

+0

@fab, grazie, mi dispiace per quello, cancellato il mio commento stupido :) – srf

0

Un modo per fare ciò è utilizzare afterGetColHeader.

Copia incollato da here

afterGetColHeader: function (col, TH) { 
     // nothing for first column 
     if (col == -1) { 
      return; 
     } 
     var instance = this; 
     // create input element 
     var input = document.createElement('input'); 
      input.type = 'text'; 
      input.value = TH.firstChild.textContent; 

     TH.appendChild(input); 

     Handsontable.Dom.addEvent(input, 'change', function (e){ 
      var headers = instance.getColHeader(); 
       headers[col] = input.value; 
      instance.updateSettings({ 
       colHeaders: headers 
      }); 
     }); 

     TH.style.position = 'relative'; 
     TH.firstChild.style.display = 'none'; 
    } 
Problemi correlati