ExtJS

Общепринятой вещью для Javascript является манипулирование секциами страницы. Как обычно включаем стандартный Ext JS и стили и давайте создадим страницу с контейнером, который нужно убрать: Когда вы загрузите это в браузере, то вы увидите только контейнер div1: div2 будет удалёт. Обратите, что селектор в Ext JS не использует хэштэг (#) как это делает jQuery. Ext JS селект Итак, Ext JS делает селекции наподобие как jQuery? У этой библиотеки есть несколько способов. Один - это метод select(), который использует нотации схоже с jQuery. ...

Как и раньше подключаем нужные стили и скрипты: Далее добавляем некоторые элементы управления для простой анимации, которая будет менять размер контейнера: Чтобы подготовить div и сделать нашу анимацию красивее, добавим чуть стилей: В конце добавим наш контейнер в тело документа: Когда закончите, то у вас получится что-то вроде Когда вы откроете это в браузере, то увидите, что контейнер увеличится и станет квадратом. Демо Пример 1 Другие команды Также можно использовать setHeight или setWidth методы, например: ...

Использование Javascript для загрузки другого файла С Ext JS можно просто делать Ajax запросы к другим страницам. Этот пример использует простой Ext JS инструмент: всплывающее окно. Обратите внимание, что включаем как и ранее стили и скрипты в наш HTML: a.html Мы передали имя функции обратного вызова к команде Ext.onReady(). Содержимое файла a.html: × Запятые В MODX менеджере используется много Ext JS и вы увидите характерный момент - вначале строки ставятся запятые, далее добавляются элементы к массиву. Это делает чуть легче комментирование нежелательных элементов. Здесь будет показан именно такой стиль форматирования, чтобы вы уже мысленно были готовы увидеть его в работающих скриптах MODX ...

Ваш первый Ext JS Script MODX идёт в комплекте с Ext JS (на самом деле с MODExt, его собственная модификация Ext JS, но они довольно-таки близки для начинающих). Нашей первой задачей - будет создание HTML станицы, которая загружает все необходимые Ext JS компоненты. А именно 3 компонента: - Стили (CSS) - Базовый JS - Все JS В этом примере создадим файл в корне вашего MODX сайта, назовём его “a.html” и дадим ссылку на Ext JS компоненты, которые находятся в составе MODX менеджера (возможно вам нужно будет поменять пути, если вы поменяли путь manager/ на другой). ...

Содержание статьи: - [Обзор]([[~133]]#DevelopinganExtrainMODXRevolution-Overview) - [Установка каталогов]([[~133]]#DevelopinganExtrainMODXRevolution-SettingUpOurDirectories) - [Создание сниппета-заготовки]([[~133]]#DevelopinganExtrainMODXRevolution-CreatingtheDoodlesSnippet) - [Настройка путей]([[~133]]#DevelopinganExtrainMODXRevolution-MakingtheMagicPathSettings) - [Создание базового класса сниппета-заготовки]([[~133]]#DevelopinganExtrainMODXRevolution-MakingtheDoodlesBaseClass) - [Создание модели]([[~133]]#DevelopinganExtrainMODXRevolution-MakingtheModel) - [Скрипт парсинга схемы]([[~133]]#DevelopinganExtrainMODXRevolution-TheSchemaParsingScript) - [Статический сниппет]([[~133]]#DevelopinganExtrainMODXRevolution-TheStaticSnippet) - [Построение запроса]([[~133]]#DevelopinganExtrainMODXRevolution-BuildingtheQuery) - [Метод getChunk]([[~133]]#DevelopinganExtrainMODXRevolution-TheDoodlesclassgetChunkMethod) - [Выводы]([[~133]]#DevelopinganExtrainMODXRevolution-Summary) Обзор Этот урок написан как всеобъемлющий пример разработки дополнения для MODX Revolution 2.2 и выше, а также описывает как упаковать дополнение в Транспортный пакет, кроме этого рассказывается как разрабатывать Дополнение вне корневого каталога MODX, чтобы можно было использовать программы контроля версий (такие как Git). ...

Этот урок состоит из серии статей: - [Часть I: Начало и создание сниппета Doodles]([[~133]]) - Часть II: Создание пользовательской страницы в менеджере Custom Manager Page - Часть III: Упаковка нашего дополнения Содержание: - [Первые шаги при установке]([[~156]]#FirstSetupSteps) - [Пространства имён]([[~156]]#Namespaces) - [Действия и меню]([[~156]]#ActionsandMenus) - [Словари]([[~156]]#Lexicons) - [Установка контроллеров с помощьюMODExt]([[~156]]#SettinguptheControllerswithMODExt) - [Базовый контроллер]([[~156]]#TheBaseController) - [Наша Doodles страница в менеджере]([[~156]]#OurDoodlesCMPPage) - [JS файл Секции]([[~156]]#TheSectionJSFile) - [JS файл Панели]([[~156]]#ThePanelJSFile) - [Разметка Doodles]([[~156]]#TheDoodlesGrid) - [Зацепка через коннекторы]([[~156]]#HookingUpviaConnectors) - [Добавление поиска]([[~156]]#AddingSearch) - [Добавление окна обновления]([[~156]]#AddinganUpdateWindow) - [Добавление опции "Убрать контекстное меню"]([[~156]]#AddingaRemoveContextMenuOption) - [Форма "Создать"]([[~156]]#CreatingtheCreateForm) - [Добавление редактирования]([[~156]]#AddingInlineEditing) - [Выводы]([[~156]]#Summary) В данном уроке расскрывается создание Пользовательской страницы в менеджере для нашего дополнения Doodles, которое мы уже создали в предыдущем уроке. Здесь объясняется создание контроллеров/коннекторов/процессоров, создание Пространства имён, Действия и элементов Меню и работа с ExtJS для создания Пользовательского интерфейса. ...