Aggiornamento di una jQuery Flexbox - jquery, jquery-flexbox

C'è un modo per aggiornare i risultati di un flexbox jQuery con un array JSON? Ho già creato la flexbox e voglio aggiornarne i risultati.

Inizializzo il mio flexbox come segue:

$("#myFlex").flexbox({
"results": [
{ "id": "1", "name": "Ant" },
{ "id": "2", "name": "Bear" }
]},
{
allowInput: false,
paging: false,
maxVisibleRows: 8
});

Questo è tratto dalla documentazionee funziona Supponiamo di voler aggiornare gli elementi senza reinizializzare la flexbox. Come si può fare?

risposte:

Ok, quindi mi sono hackerato una soluzione!

Flexbox imposta i dati attraverso la variabile o.source dopo l'inizializzazione.

Quello che ho fatto è stato archiviare (e accedere) o.source come jQuery .data(). Questo mi consente di visualizzare / modificare il valore.

Durante la sperimentazione di questo stesso problema, ho scoperto che jQuery Flexbox memorizza i dati passati come riferimento. Ciò significa che puoi fare questo:

var data = {results: [{id:1,name:"Ant"},{id:2,name:"Bear"}], total:2};
$("#myFlex").flexbox(data);

// ...

data.results[data.total] = {id:3,name:"Cat"};
data.total++;

con il plugin stock e funzionerà. L'unica cosa da tenere a mente è che devi ricordarti di aggiornare anche il .total proprietà quando si aggiungono nuovi elementi.

Non hai specificato come hai inizializzato il flexbox o come stai recuperando i dati documentazione e il demo, la proprietà JSON denominata results viene utilizzato per ottenere le righe di dati quando hai specificato un URL. Ciò dovrebbe accadere automaticamente, ad esempio (direttamente dai documenti):

$.ready(function() {
// results.aspx is the page that returns json data in the expected format
$("#fb").flexbox("results.aspx");
});

Risposta campione:

{"results":[
{"id":1,"name":"Ant"},
{"id":2,"name":"Bear"},
{...} // more results here...
]}

In alternativa, dovresti essere in grado di usarlo resultsProperty per specificare un nome di proprietà diverso.