Записи с меткой «jquery»

Внедряем js модуль в query plugin

Например написан модуль SelectControl по принципу amd : define(«SelectControl», [«jquery»/* TODO uncomment: , «addJqueryPlugin» */], function($) { function SelectControl() { this.init.apply(this, arguments); } $.extend(SelectControl.prototype = new ParentClass(), { defaults: { element: $() , someProperty: «someProperty» } , init: function (options) { $.extend(true, this, ParenClass.defaults, this.defaults, options); } , someMethod: function() { console.log(«I am » + this.element); …

Soap вызов, используя jquery.ajax

Иногда не хочется делать запрос с клиента на свой сервер, который в свою очередь, используя soap клиент, делает запрос еще на один сервер (soap сервер). Сделаем запрос на soap сервер сразу с клиента. Код js на клиенте var soapMessage = ‘<soap:Envelope xmlns:xsi=»http://www.w3.org/2001/XMLSchema-instance» xmlns:xsd=»http://www.w3.org/2001/XMLSchema» xmlns:soap=»http://schemas.xmlsoap.org/soap/envelope/»>’ + ‘<soap:Body>’ + ‘<SomeMethod>’+ ‘<Arg1>Arg1 Value</Arg1>’+ ‘<Arg2>Arg2 Value</Arg2>’+ ‘</SomeMethod>’+ ‘</soap:Body>’ + ‘</soap:Envelope>’; …

Реализуем менеджер картинок в редакторе tinymce

На официальном сайте tinymce предлагают подключить файловый менеджер MoxieManager. Но этот менеджер вовсе не бесплатный. Реализуем свой менеджер для картинок. Покажем кнопку «обзор». Для этого при инициализации плагина tinymce передадим такие настройки: setup : function(ed) { file_browser_callback_types: ‘image’, // файловый менеджер будет работать только для картинок file_browser_callback : function(field_name, url, type, win){ var filebrowser = «/Images/ImageManagerSearch?type=» + …

Работаем с JQuery Deferred

В JQuery есть такой удобный объект — Deferred, который позволяет выполнять отложенные действия в зависимости от состояния, которое нужно установить в тот момент, когда мы хотим выполнить нужные действия. Так же можно выполнять последующие действия уже после установки состояния данного объекта. Создаем deferred объект var defObj = new $.Deferred(); Добавляем отложенные действия. defObj.done( function(data1, data2, dataN) …

Пишем модули на javascript и загружаем их при помощи requirejs

В ECMAScript 6 есть уже классы. Но думаю их пока рано еще использовать. Опишу способ создания модулей, которым пользуюсь я. Создадим файл MyClass.js и напишем в нем модуль MyClass var MyClass = (function($, ParentClass) { /** * Конструктор является прокси для метода init * @constructor */ function MyClass() { this.init.apply(this, arguments); } /** * В прототипе содержатся …

Делаем все картинки кликабельные в редакторе tinymce

И так задача такая: некие картинки добавляются с помощью редактора tinymce и нужно чтоб при клике на картинку открывалась галерея картинок (в моем случае это shadowbox галерея). Для того чтобы картинки открывались в галереи shadowbox, нужно сделать обертки над картинками: <a href=»images/max/my.jpg» rel=»shadowbox[mygallery];player=img;»><img src=»images/thumbnails/my.jpg»/></a> Реализация: привязываемся к событиям BeforeSetContent и SaveContent. Перед вставкой контента в редактор, удаляем все …

Адаптивный слайдер jcarousel

Создадим слайдер, который бы адаптировался под разные устройства. Используем для этого jquery плагин jcarousel. Скачаем плагин http://sorgalla.com/jcarousel/dist/ и подключим у себя на странице. Добавим стили с помощью less // jCarousel // ——————- .jcarousel-wrapper { position: relative; } .jcarousel { position: relative; overflow: hidden; width: 100%; } .jcarousel ul { position: relative; width: 200%; list-style: none; margin: 0; …