Dati UI di KendoInserire utilizzando l'oggetto javascript

Question

Ho appena iniziato a sperimentare con l'interfaccia utente di Kendo e sono rimasto bloccato su come utilizzare un oggetto javascript standard da utilizzare come origine dati.

È abbastanza facile caricare inizialmente i dati dall'oggetto javascript, ma voglio essere in grado di recuperare i dati dopo che sono avvenute modifiche nell'interazione dell'utente.

Preferibilmente, se questo oggetto è in qualche modo sincronizzato con il widget, quindi tutto ciò che si deve fare è leggere/scrivere su questo oggetto javascript.

I nostri dati:

var _data = [ 
{ 
    eventID: 8, 
    title: "Group meeting.", 
    start: new Date("2013/06/13 07:00"), 
    end: new Date("2013/06/13 08:30"), 
    pending:false, 
    recurrenceRule: "", 
    recurrenceException: "", 
    description: "Take my brother to his group meeting.", 
    isAllDay:false, 
    ownTimeSlot:true, 
    careAssistantId: 5, 
    clientId: 6 
},{ 
    eventID: 9, 
    title: "Make dinner.", 
    start: new Date("2013/06/13 11:00"), 
    end: new Date("2013/06/13 13:30"), 
    pending:true, 
    recurrenceRule: "", 
    recurrenceException: "", 
    description: "Make dinner for my mom.", 
    isAllDay:false, 
    ownTimeSlot:true, 
    careAssistantId: 5, 
    clientId: 6 
} ]; 

Init widget

function save(){ 
    console.log(_data);  
} 

$('.schedule').kendoScheduler({ 
     date: new Date("2013/6/13"), 
     startTime: new Date("2013/6/13 07:00 AM"), 
     height: 600, 
     views: [ { type: "week", selected: true }], 
     save: save, 
     dataSource:_data 
}); 

Ecco la configurazione di codice da testare (notare il debug di console.log su Save):

http://jsfiddle.net/t23Ce/11/

Come si può leggere/scrivere lo 'stato' nel mondo dell'interfaccia utente di Kendo?

Answer 1

Un semplice array non può fornire il rilevamento delle modifiche, in modo da viene convertito in un DataSource quando si crea il widget. È possibile accedere alla stato attuale dei vostri dati in diversi modi:

1. ottenere un array per scorrere sopra all data: dataSource.data()
2. accesso un specific item: dataSource.at(1)
3. ottenere filtered data: datasource.view()
4. ottenere un pure JS array indietro : dataSource.data().toJSON()

Answer 2

Nonostante si inizializza il dataSource da un array JavaScript (_data), KendoUI crea internamente un DataSource (nel tuo caso un SchedulerDataSource) che utilizza solo l'array per il caricamento del contenuto iniziale.

Se è necessario/si desidera continuare a utilizzare l'array e riflettere le modifiche in esso, è probabile che sia necessario scrivere del codice per aggiornarlo.

Se si può vivere con _data definito come un ShedulerDataSource, allora si può provare definendolo come:

var _data = new kendo.data.SchedulerDataSource({ 
    data: [ { 
     eventID: 8, 
     title: "Group meeting.", 
     start: new Date("2013/06/13 07:00"), 
     end: new Date("2013/06/13 08:30"), 
     pending:false, 
     recurrenceRule: "", 
     recurrenceException: "", 
     description: "Take my brother to his group meeting.", 
     isAllDay:false, 
     ownTimeSlot:true, 
     careAssistantId: 5, 
     clientId: 6 
    },{ 
     eventID: 9, 
     title: "Make dinner.", 
     start: new Date("2013/06/13 11:00"), 
     end: new Date("2013/06/13 13:30"), 
     pending:true, 
     recurrenceRule: "", 
     recurrenceException: "", 
     description: "Make dinner for my mom.", 
     isAllDay:false, 
     ownTimeSlot:true, 
     careAssistantId: 5, 
     clientId: 6 
    } ], 
    schema: { 
     model : { 
      id : "eventID" 
     } 
    } 
}); 

vedere in esecuzione qui: http://jsfiddle.net/OnaBai/t23Ce/14/