vitalets/x-editable

In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery.

X-editable

In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery., _(*1)

Live Demo

http://vitalets.github.io/x-editable/demo.html, _(*2)

Pull Requests

Please submit all Pull Requests to the develop branch: https://github.com/vitalets/x-editable/tree/develop, _(*3)

Issue Tracker

Please report all issues here: https://github.com/vitalets/x-editable/issues, _(*4)

Documentation

http://vitalets.github.io/x-editable, _(*5)

Project Status

Actively maintained, _(*6)

How to get it

Manual download

Use http://vitalets.github.io/x-editable main page., _(*7)

Bower

bower install x-editable

CDN

Bootstrap 3 build:, _(*8)

<link href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/css/bootstrap-editable.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap3-editable/js/bootstrap-editable.min.js"></script>

Bootstrap 2 build:, _(*9)

<link href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap-editable/css/bootstrap-editable.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/bootstrap-editable/js/bootstrap-editable.min.js"></script>

jQuery UI build:, _(*10)

<link href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/jqueryui-editable/css/jqueryui-editable.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/jqueryui-editable/js/jqueryui-editable.min.js"></script>

jQuery only build:, _(*11)

<link href="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/jquery-editable/css/jquery-editable.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/x-editable/1.5.0/jquery-editable/js/jquery-editable-poshytip.min.js"></script>

Reporting issues

Please provide jsFiddle when creating issues!
It's really saves much time. Use these as template:
1. jsFiddle Bootstrap 3
2. jsFiddle Bootstrap 2
3. jsFiddle jQuery-ui
4. jsFiddle jQuery
Your feedback is very appreciated!, _(*12)

Contribution

A few steps how to start contributing.
Assuming you have Node.js already installed., _(*13)

1.Fork X-editable on github and clone it to your local mashine:, _(*14)

git clone https://github.com/<your-github-name>/x-editable.git -b dev

2.Install grunt-cli globally (if not yet):, _(*15)

npm i -g grunt-cli

3.Install dependencies:, _(*16)

cd x-editable
npm i

4.Make your changes:, _(*17)

vim editable-form.js

5.Write some tests for your changes:, _(*18)

vim /test/unit/*.js

6.Run tests in cli:, _(*19)

grunt test

or directly in browser:, _(*20)

grunt server

and open http://127.0.0.1:8000/test
By default test run on bootstrap 3 popup version, but you can test any other build:, _(*21)

• bootstrap 3
  • popup: http://127.0.0.1:8000/test/?f=bootstrap3&c=popup
  • inline: http://127.0.0.1:8000/test/?f=bootstrap3&c=inline
• bootstrap 2
  • popup: http://127.0.0.1:8000/test/?f=bootstrap2&c=popup
  • inline: http://127.0.0.1:8000/test/?f=bootstrap2&c=inline
• jquery-ui
  • popup: http://127.0.0.1:8000/test/?f=jqueryui&c=popup
  • inline: http://127.0.0.1:8000/test/?f=jqueryui&c=inline
• jquery + poshytip
  • popup: http://127.0.0.1:8000/test/?f=plain&c=popup
  • inline: http://127.0.0.1:8000/test/?f=plain&c=inline

7.Commit and push back on github:, _(*22)

git add .
git commit -m'refactor editable form, fix #123'
git push origin

8.Make pull request on github (to dev branch)., _(*23)

Thanks for your support!, _(*24)

Local build

To build x-editable locally please run:, _(*25)

grunt build

Result will appear in dist directory., _(*26)

License

Copyright (c) 2012 Vitaliy Potapov
Licensed under the MIT license., _(*27)