https://github.com/ange007/jqueryformstyler-modern
JQuery HTML form styling plugin.
https://github.com/ange007/jqueryformstyler-modern
buttons css form-style form-styler formstyler input jquery jquery-html jquery-plugin js password plugin range range-slider select selectbox style stylesheet ui ui-components
Last synced: 3 months ago
JSON representation
JQuery HTML form styling plugin.
- Host: GitHub
- URL: https://github.com/ange007/jqueryformstyler-modern
- Owner: ange007
- License: other
- Created: 2015-12-10T13:10:09.000Z (over 9 years ago)
- Default Branch: release
- Last Pushed: 2019-04-12T19:23:09.000Z (about 6 years ago)
- Last Synced: 2025-01-18T12:15:57.619Z (4 months ago)
- Topics: buttons, css, form-style, form-styler, formstyler, input, jquery, jquery-html, jquery-plugin, js, password, plugin, range, range-slider, select, selectbox, style, stylesheet, ui, ui-components
- Language: CSS
- Homepage: http://ange007.github.io/JQueryFormStyler-Modern/
- Size: 7.56 MB
- Stars: 18
- Watchers: 7
- Forks: 4
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# jQuery FormStyler Modern [2.x](CHANGELOG.md)
[](https://packagist.org/packages/ange007/jquery-formstyler-modern)
[](https://packagist.org/packages/ange007/jquery-formstyler-modern)
[](https://packagist.org/packages/ange007/jquery-formstyler-modern)
[](https://travis-ci.org/ange007/JQueryFormStyler-Modern)
> Самостоятельное ответвление от плагина **[jQueryFormStyler](https://github.com/Dimox/jQueryFormStyler)**
- [Demo](http://ange007.github.io/JQueryFormStyler-Modern/)
- [Changelog](CHANGELOG.md)
- [Contributing](CONTRIBUTING.md)
- [Download](https://github.com/ange007/JQueryFormStyler-Modern/releases)
## Info
JQuery HTML form styling and modernization plugin:
- ``
- ``
- ``
- ``
- `` *(styling and show/hide password button)*
- `` *(styling and function for search on server by AJAX requests)*
- ``, ``, `` and other *(styling only with CSS)*
## Attention!
Settings from plugin vesion **2.x** - differ from version **1.x**.
> Структура настроек плагина версии **2.x** - отличаются от настроек [оригинального](https://github.com/Dimox/jQueryFormStyler) и версии [1.x](https://github.com/ange007/JQueryFormStyler-Modern/tree/1.x---release) данного плагина.
## Install
Composer:
```sh
$ php composer.phar require "ange007/jquery-formstyler-modern"
```
NPM:
```sh
$ 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.
```javascript
$( 'input, select, button' ).styler(
{
locale: 'ru',
select: {
search: {
limit: 10
}
},
onFormStyled: function( )
{
...
}
} );
```
Reload plugin with certain settings.
```javascript
$( '#checkbox-indeterminate-change' ).styler( 'reinitialize', { checkbox: { indeterminate: true } } );
```
Clean style.
```javascript
$( 'input, select, button' ).styler( 'destroy' );
```
Repaint after "manual" change.
```javascript
$( this ).prop( 'disabled', true )
.trigger( 'repaint' );
```
Search from server.
```javascript
$( '#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
};
}
}
}
}
} );
```