Создание плагинов jquery - PullRequest
1 голос
/ 29 июля 2010

Я пытаюсь создать плагин jquery для разбивки на таблицы ajax (т.е. получить данные и воссоздать tbody при его вызове.

Может кто-нибудь предложить учебник, который покажет мне, как делать все этиВещи? Я хочу придерживаться следующих пунктов:

1) Плагин должен использовать синтаксис jquery ui
2) Плагин должен использоваться более чем в одной таблице на одной странице
3) Плагин должен иметь свои собственные методы, добавлять и заменять

Вот основные вещи, на которых я застрял.

Как работает область действия? Т.е. если у меня есть функция, которая вызывается через $('#table1').tPaginate('append');, то эта функция должна хранить некоторые данные из запроса AJAX, так и остальные строки.Где я могу сохранить это, следуя онлайн-учебникам, которые я нигде не нашел, которые, по-видимому, действительны для хранения постоянной переменной.

Как вы справляетесь с проверкой ошибок и т. Д., Если что-то в вашем плагине ломается, как вы позволяетедругие "функции" внутри знают об этом.опять это, кажется, возвращается к вопросу о сфере применения.

Ответы [ 3 ]

3 голосов
/ 02 августа 2010

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

(function($)
{
  $.tPaginateInternal = {
    Append: function(el) { },
    Replace: function(el) { }
  };

  $.fn.tPaginate = function(arg1) {
    return this.each(function() {
      // Do work here

      $.tPaginateInternal.Append(this);
    });
  };
})(jQuery);

После этого вы сможете звонить:

$("#table1").tPaginate("append");

То, что этот маленький кусочек кода показывает вам, это то, что вы можете:

  1. Создайте объект, который обернет вашу логику для вашего плагина ($.tPaginateInternal)
  2. Создание функции плагина, которая работает на нескольких элементах (return this.each)
  3. Завершите вызов плагина безопасным способом ((function($)) и т. Д.

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

2 голосов
/ 29 июля 2010

Я считаю, jQgrid - это то, что вы ищете.

Проект дома здесь

1 голос
/ 07 августа 2010

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

Вы можете использовать функцию .data () в jQuery для хранения всего, что вы хотите, в элементе таблицы. Тогда любые действия или события, которые вы подключите, могут использовать эти данные для выполнения своих действий. Должен отметить, что вы можете хранить все, что захотите, включая функции, которые будут выполнены позже.

$('#myTable').data('loadPageFunc', function(pageNumber, pageCount){
   //make ajax call and fill in the table
});

//later in code
$('#myTable').data('loadPageFunc')(1, 10);

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

Надеюсь, это поможет. Моя единственная другая идея о отслеживании состояния - использование замыканий (анонимных функций, которые ссылаются на данные вне их области видимости). Замыкания сохраняют ссылку на данные, и вы позже используете замыкание в коде. Я не уверен, что это действительно поможет вам, но они очень удобны для подключения кода события, и вы, вероятно, уже много использовали замыкания в jQuery.

...