❤
npm
Sign UpSign In

jquery.formstyler-modern

2.1.6 • Public • Published

jQuery FormStyler Modern 2.x

Latest Stable Version Total Downloads License Build Status

Самостоятельное ответвление от плагина jQueryFormStyler

jQuery FormStyler Modern

Info

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)

Attention!

Settings from plugin vesion 2.x - differ from version 1.x.

Структура настроек плагина версии 2.x - отличаются от настроек оригинального и версии 1.x данного плагина.

Install

Composer:

$ php composer.phar require "ange007/jquery-formstyler-modern"

NPM:

$ npm i jquery.formstyler-modern

Getting Started

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

Works

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
                    };
                }
            }
        }
    }
} );

Readme

Keywords

Package Sidebar

Install

npm i jquery.formstyler-modern

Repository

github.com/ange007/JQueryFormStyler-Modern

Homepage

github.com/ange007/JQueryFormStyler-Modern

Weekly Downloads

2

Version

2.1.6

License

MIT

Unpacked Size

427 kB

Total Files

17

Last publish

Collaborators

  • ange007
Try on RunKit
Report malware