jQuery FormStyler Modern 2.x
Самостоятельное ответвление от плагина jQueryFormStyler
JQuery HTML form styling and modernization plugin:
<input type="checkbox">
<input type="radio">
<input type="file">
<input type="number">
<input type="password">
(styling and show/hide password button)<select>
(styling and function for search on server by AJAX requests)<input type="range">
,<textarea>
,<button>
and other (styling only with CSS)
Settings from plugin vesion 2.x - differ from version 1.x.
Структура настроек плагина версии 2.x - отличаются от настроек оригинального и версии 1.x данного плагина.
Composer:
$ php composer.phar require "ange007/jquery-formstyler-modern"
NPM:
$ npm i jquery.formstyler-modern
Main plugin file - jquery.formStylerModern.js
.
Connection of styles is possible in two ways:
jquery.formStylerModern.css
(frame and default style)- Frame file -
/style/jquery.formStylerModern.frame.css
and style file -/style/jquery.formStylerModern.(default|bootstrap|etc).css
Stylish elements.
$( 'input, select, button' ).styler(
{
locale: 'ru',
select: {
search: {
limit: 10
}
},
onFormStyled: function( )
{
...
}
} );
Reload plugin with certain settings.
$( '#checkbox-indeterminate-change' ).styler( 'reinitialize', { checkbox: { indeterminate: true } } );
Clean style.
$( 'input, select, button' ).styler( 'destroy' );
Repaint after "manual" change.
$( this ).prop( 'disabled', true )
.trigger( 'repaint' );
Search from server.
$( '#search' ).styler( 'reinitialize', {
select: {
search: {
ajax: {
delay: 250,
cache: true,
url: 'https://api.github.com/search/repositories',
data: function( params ) {
return {
q: params.term,
page: params.page
};
},
processResults: function( data, params )
{
var items = [ ];
$( data.items ).each( function( index, value )
{
items.push( { 'value': value.html_url,
'caption': value.owner.login + '/' + value.name } );
} );
return {
items: items
};
}
}
}
}
} );