Alterator/class alterator-listbox: различия между версиями
Snejok (обсуждение | вклад) Нет описания правки |
Нет описания правки |
||
Строка 133: | Строка 133: | ||
Соответственно для single-select вместо столбца с checkbox-ами будет столбец с radiobutton-ами и переменной in_hosts будет присвоено только одно значение host1 или host2 | Соответственно для single-select вместо столбца с checkbox-ами будет столбец с radiobutton-ами и переменной in_hosts будет присвоено только одно значение host1 или host2 | ||
{{Category navigation|title=Alterator|category=Alterator|sortkey={{SUBPAGENAME}}}} |
Текущая версия от 20:22, 20 июля 2015
Актуально для alterator-4.17-alt3 alterator-fbi-5.26-alt1
25/05/2010
HTML
Пример html-кода в вашем index.html
<form method="POST"> <table style="width:100%" name="hosts" class="alterator-listbox"> <thead> <tr> <th><span translate="_">Host</span></th> <th><span translate="_">Summary</span></th> </tr> </thead> <tbody> <tr> <td nowrap="yes"><span class="alterator-label" name="name"/></td> <td><span class="alterator-label" name="summary"/></td> </tr> </tbody> </table> </form>
Т.е. мы хотим получить таблицу с двумя колонками, причем с возможностью сортировки этих колонок по алфавиту. Первая колонка у нас имя хоста, вторая информация о нем.
Важно, чтобы класс у таблицы был class="alterator-listbox"
, у таблицы так же должно быть уникальное имя, в нашем случаи это name="hosts"
Автозаполнение таблицы будет идти по тегам
Один из span тегов должен называться name т.е. . Почему так, необходимо проверить в коде самого алтератора, без такого тега не будет корректна заполнена таблица.
Итого, у нас получается html-таблица с именем hosts, классом alterator-listbox, одним и более элементами , которые в свою очередь имеют уникальное имя и класс alterator-label, один из span элементов должен иметь имя name, его положение не важно.
AJAX Пример scheme-кода в ajax.scm
(define-module (ui mySuper-module ajax) :use-module (alterator woo) :use-module (alterator ajax) :export (init)) (define (ui-init . data) (form-update-enum "hosts" (woo-list "/mySuper-module")) ) (define (init) (ui-init) )
При обращении к странице с нашим модулем mySuper-module, будет вызвана функция init (в конце приведенного кода), которая в свою очередь вызовет ui-init.
Основное действо заключено в вызове (form-update-enum "hosts" (woo-list "/mySuper-module")), которое заключается в обновлении таблицы hosts списком, полученным вызовом backend'а командой alterator-cmdline /mySuper-module action list .
Все достаточно просто. Можно использовать данный шаблон. Стоит только заменить mySuper-module на что-то более точное и при вызове woo-list использовать не прямое обращение к модулю, а дополнить его чем-нибудь типа "/mySuper-module/avail_objects", так чтобы можно было через один и тот же метод list обращаться к различным объектам avail_myobject avail_hosts и так далее. Пример можно посмотреть в alterator-sysinfo-0.8-alt3 (html,ajax).
Backend
Пример shell-backend'а
#!/bin/sh #turn of auto expansion set -f alterator_api_version=1 . alterator-sh-functions . shell-config list() { echo -e "aaa\nbbb\n" | while read i ;do write_table_item \ name "$i" summary "summary "$i"" \ host "$i" done } on_message(){ case "$in_action" in read) : ;; list) list ;; esac } message_loop
Для построения правильного ответа будет использована функция из alterator-sh-functions-0.13-alt2 write_table_item. Ей необходимо передавать пару имя от span элемента и значение. Одно из имен обязательно должно быть name. Пример использования выше, функция list().
Single-select Multi-select Editable
Таблица всем хороша, но обычно возникает желание выбирать строки из этой таблицы и производить какие-то действия с ней. Для этого у класса alterator-listbox имеются три расширения single-select, multi-select и editable, для выбора одной строки, множества строк или редактирования и добавления строк.
html-код
<form method="POST"> <table style="width:100%" name="hosts" class="alterator-listbox multi-select"> <thead> <tr> <th><span translate="_">Host</span></th> <th><span translate="_">Summary</span></th> </tr> </thead> <tbody> <tr> <td nowrap="yes"><span class="alterator-label" name="name"/></td> <td><span class="alterator-label" name="summary"/></td> </tr> </tbody> </table> </form>
Т.е. в class alterator-listbox было добавлено ключевое слово multi-select, после чего автоматически будет добавлен первый столбец в нашу таблицу с checkbox-ами для каждой строки.
Для передачи нескольких выбранных элементов в backend переменная in_hosts (значение name нашей таблицы) будет принимать значения равные значениям span элемента с name="name". Если выбрано более одного элемента, то в переменной они будут разделены символом ;. Т.е. если у меня в таблице два хоста host1 и host2, я выберу их и отошлю форму серверу, то в backend приедет переменная in_hosts = "host1;host2".
Соответственно для single-select вместо столбца с checkbox-ами будет столбец с radiobutton-ами и переменной in_hosts будет присвоено только одно значение host1 или host2