Form X-editable form x-editable samples
X-editable
This library allows you to create editable elements on your page. It can be used with any engine (bootstrap, jquery-ui, jquery only) and includes both popup and inline modes. Please try out demo to see how it works.
For more info please check out the official documentation
                                                    
                                                    Editable Form
                                                
                                                | Username | superuser | Simple text field | 
| First name | Required text field, originally empty | |
| Sex | Select, loaded from js array. Custom display | |
| Group | Admin | Select, loaded from server. No buttons mode | 
| Status | Active | Error when loading list items | 
| Plan vacation? | 25.02.2013 | Datepicker | 
| Date of birth | Date field (combodate) | |
| Setup event | Datetime field (combodate) | |
| Meeting start | 15/03/2013 12:45 | Bootstrap datetime | 
| Comments | 
                                                                        awesome
                                                                             user!  | 
                                                                    Textarea. Buttons below. Submit by ctrl+enter | 
| Type State | Bootstrap 2.x typeahead | |
| Fresh fruits | Checklist | |
| Tags | html, javascript | Select2 (tags mode) | 
| Country | Select2 (dropdown mode) | |
| Address | Your custom input, several fields | |
| Notes | 
                                                                        WYSIWYGWYSIWYG means What You See Is What You Get.But may also refer to: 
  | 
                                                                    
                                                                        
                                                                             [edit] 
                                                                         Wysihtml5 (bootstrap only). Toggle by another element  |