addyosmani/jquery-ui-bootstrap — pull request #31 by panosru (2012-01-12 21:46:26+00:00)
Title: jQuery UI custom input fields

I added the support for custom input fields with the look and feel of Twitter bootstrap. I used filament's jquery plugin and I improved it a little bit in order to fit the needs.

You can check the input file here: http://panosru.github.com/jquery-ui-bootstrap

You can customize it on how ever you like, the main properties are the followings:

1. **button_position** (default value is *right* it accepts *right* or *left* as values)
2. **extra_class** (default value is *span3* it accepts classes, mostly used to set the width of the element but you can hook more classes by separating them with space)
3. **feedback_text** (default value is *No file selected...*)
4. **button_text** (default value is *Browse*)
5. **button_change_text** (default value is *Change*)

You can have your input file html like this: ``

and your js code like this: `$('#file').customFileInput();`

The interesting part is the *button_text* and *button_change_text* properties where you can set your html code (for example an image tag and you then will have an image instead of text button

for example the following:

$('#file').customFileInput({
button_text : ''
});

will produce something like this: ![image button](http://dl.dropbox.com/u/16165490/Screenshots/jquery-bootstrap-image-button.png)