JQuery плагин Breedlib

Плагин jQuery создан для сайта - для быстрого заполнения полей.

Установка плагина и его настройка:

Скачиваем архив плагина по ссылке. - zip архив, пример и сам плагин.

Установка:

Для установки плагина подключите библиотеки и стили - папка jQuery library.

Подключение:


Не забываем про Основную библиотеку jQuery.

Инициализация библиотеки очень проста:

$('form').breedlib();

Пдагин работает с формой отправки данных в момент регистрации, поэтому селектор используем form
На этом плагин инициализировался и появилась кнопка "Выберите файл".

Манипуляция с кнопкой сама по себе ничего не даст, нужен сам файл, который вы сможете скачать по ссылке под кнопкой...

И даже после загрузки файла, чудесной замены не произойдет. Плагин нуно настроить!

Итак, настройки плагина:

1. button - по умолчанию значение true
Принимает значение true/ false - Вывод кнопки, которая нам нужна.

2. wrapButton - по умолчанию значение true

Принимает значение true/ false - Обертка input type="file", наше поле приобрело красивый вид.

3. link - по умолчанию значение true
Принимает значение true/ false - ссылка на ресурс с генерацией файла, быстро и легко создать файл генерации.

4. dataBreedlib - это ваши поля input в форме! Это важно без этого поля так и будут пустыми.

Работает очень просто:

dataBreedlib: [{
     name: 'ФИО',
     value: 'name'
  },{
    name: 'Страна',
    value: 'country'
  }
}]

Это обычный формат - ключ и значение, только значения устанавливаются вами.

name - имя или значение данных в json файле, который подставляем.

То есть имя поля...

Например, сгенерированный json файл выглядит следующим образом:

[{
"name":"ФИО",
"value":"Ваша фамилия имя отчество"
},{
"name":"Страна",
"value":"Название страны"
}
}]

Таким образом указываем в dataBreedlib:

dataBreedlib: [{
     name: 'ФИО',
     value: 'name'
  }]


value - это название name вашего input файла.
Пример,



name="name">


name="country">


name="city">


dataBreedlib: [{
     name: 'Страна',
     value: 'country'
  }]

Обходим свою форму и добавляем dataBreedlib. В интернете формы всего навсего состоят из нескольких полей...
Поэтому обойти их не составит труда... Но такой способ более простой и каждый сможет установить к себе на сайт кнопку. Не зависимо от количества полей и их расположения.

Сгенерируйте файл по ссылке - и приведите к соответствию поле name в dataBreedlib -  name: 'JSON Значение'.

Пример, можно посмотреть у себя на компьютере, достаточно скачать архив по ссылке. JSON файл входит в архив.

Ссылка на генерацию файла - сгенерировать тут.