Пролистывание записей с использованием jQuery - PullRequest
Новая
       35

Пролистывание записей с использованием jQuery

1 голос
/ 05 февраля 2009

У меня есть результат JSON, который содержит множество записей. Я хотел бы показать первый, но есть следующая кнопка для просмотра второго и так далее. Я не хочу, чтобы страница обновлялась, поэтому надеюсь, что сочетание JavaScript, jQuery и даже сторонней библиотеки AJAX может помочь.

Есть предложения?

Ответы [ 3 ]

4 голосов
/ 05 февраля 2009

Надеюсь, это поможет: 

var noName = {
    data: null
    ,currentIndex : 0
    ,init: function(data) {
        this.data = data;
        this.show(this.data.length - 1); // show last
    }
    ,show: function(index) {
        var jsonObj = this.data[index];
        if(!jsonObj) {
            alert("No more data");
            return;
        }
        this.currentIndex = index;
        var title = jsonObj.title;
        var text = jsonObj.text;
        var next = $("<a>").attr("href","#").click(this.nextHandler).text("next");
        var previous = $("<a>").attr("href","#").click(this.previousHandler).text("previous");

        $("body").html("<h2>"+title+"</h2><p>"+text+"</p>");
        $("body").append(previous);
        $("body").append(document.createTextNode(" "));
        $("body").append(next);
    }
    ,nextHandler: function() {
        noName.show(noName.currentIndex + 1);
    }
    ,previousHandler: function() {
        noName.show(noName.currentIndex - 1);
    }
};

window.onload = function() {
    var data = [
        {"title": "Hello there", "text": "Some text"},
        {"title": "Another title", "text": "Other"}
    ];
    noName.init(data);
};
2 голосов
/ 05 февраля 2009

Я использую jqgrid именно для этой цели. Работает как шарм.

http://www.trirand.com/blog/

1 голос
/ 05 февраля 2009

Я бы лично загружал данные json в глобальную переменную и таким образом разбивал их на страницы. Надеюсь, вы не возражаете против моих предположений о контексте данных опроса. Я думаю, что помню вас со вчерашнего дня. 

var surveyData = "[{prop1: 'value', prop2:'value'},{prop1: 'value', prop2:'value'}]"
$.curPage = 0;

$.fn.loadQuestion = function(question) {
    return this.each(function() {
        $(this).empty().append(question.prop1);
        // other appends for other question elements
    });
}

$(document).ready(function() {
    $.questions = JSON.parse(surveyData);  // from the json2 library json.org
    $('.questionDiv').loadQuestion($.questions[0]);     

    $('.nextButton').click(funciton(e) {
        if ($.questions.length >= $.curPage+1)
            $('.questionDiv').loadQuestion($.questions[$.curPage++]);
        else
            $('.questionDiv').empty().append('Finished');
    });
});

~ UnTested

Я должен признать, что @sktrdie подход к созданию целого плагина для обработки опроса был бы хорош. ИМО этот метод действительно путь решения наименьшего сопротивления.

...