Обновление jQuery flexbox

Question

Есть ли способ обновить результаты флексбокса jQuery с массивом JSON? Я уже создал flexbox и хочу обновить его результаты.

Я инициализирую свой flexbox следующим образом:

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

Это взято из документации , и это работает. Предположим, я хочу обновить элементы без повторной инициализации flexbox. Как это можно сделать?

Answer 1

Хорошо, так что я взломал себе решение!

Flexbox устанавливает данные через переменную o.source при инициализации.

То, что я сделал, было сохранить (и получить доступ) o.source какjQuery .data().Это позволяет мне просматривать / изменять значение.

Answer 2

Экспериментируя с этой же проблемой, я обнаружил, что jQuery Flexbox хранит данные, переданные в качестве ссылки. Это означает, что вы можете сделать это:

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++;

со стоковым плагином, и он будет работать. Единственное, что нужно иметь в виду, это то, что при добавлении новых элементов вы должны также обновлять свойство .total.

Answer 3

Вы не указали, как вы инициализировали flexbox или как вы возвращаете данные. Однако согласно документации и demos свойство JSON с именем results используется для получения строк данных, когда вы указали URL-адрес. Это все должно происходить автоматически. Например (прямо из документов):

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

Пример ответа:

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

Кроме того, вы можете использовать resultsProperty для указания другого имени свойства.