Here is the original plugin:
http://www.appelsiini.net/projects/jeditable
It let’s you implement inline editing capabilities and it’s supported by major browser.
Here are some examples:
http://www.appelsiini.net/projects/jeditable/default.html
An example usage is like this:
$(".edit_area").editable("http://www.example.com/save.php", { type : 'textarea', cancel : 'Cancel', submit : 'OK', indicator : "<img src='img/indicator.gif'>", tooltip : 'Click to edit...' });
The problem is, it doesn’t support password input types, but here is how to add this support.
1 – Open the plugin file.
2 – Find this code:
text: { element:function(settings,original) { var input=$('<input>'); if(settings.width!='none') { input.width(settings.width); } if(settings.height!='none') { input.height(settings.height); } input.attr('autocomplete','off'); $(this).append(input); return(input); } },
3 – Add this after that:
password: { element:function(settings,original) { var input=$('<input type="password">'); if(settings.width!='none') { input.width(settings.width); } if(settings.height!='none') { input.height(settings.height); } input.attr('autocomplete','off'); $(this).append(input); return(input); } },
Now you can do:
$(".edit_area").editable("http://www.example.com/save.php", { type : 'password', cancel : 'Cancel', submit : 'OK', indicator : "<img src='img/indicator.gif'>", tooltip : 'Click to edit...' });
It’s odd that the developers didn’t add this capability…
Hamid Alipour is a partner in Codehead, LLP with his wife, Tess. Hamid speaks 12 markup and programming languages [Yes, 12: PHP, CSS, Ajax, JavaScript, HTML/XHTML, Java, Python, C/C++, ASP, Visual Basic, Scheme and Action Script]; has a penchant for solving the unsolvable; an affinity for clean, hand-written code and is a Zend Certified 