- jEditable passes values as $_POST as default
- It grabs the ID from the container as value to the $_POST. Example:
1
<div id="item01">Editable text</div>
<div id="item01">Editable text</div>
To retrieve: $id = $_POST[’id’] will return “item01″ – this is meant to be passing unique ID. An example would be the Primary Auto-increment ID.
- Set a class and delcare it to jEditable to make them editable. Example:
1 2
<div id="unique-id-1" class="editable">This is the editable text</div> <div id="unique-id-2" class="editable">This is the editable text</div>
<div id="unique-id-1" class="editable">This is the editable text</div> <div id="unique-id-2" class="editable">This is the editable text</div>
- The HTML
1 2 3 4 5
This is item 1 This is item 2 This is item 2
This is item 1 This is item 2 This is item 2
- Javascript:
$(document).ready(function() { $('.editable').editable( 'jedit.php', { "indicator" : 'Saving...', "tooltip" : "Click to edit...", "type" : "textarea", "cancel" : "Cancel", "submit" : "Save" }); }); - The PHP: jedit.php
Note: Must re-echo the results for the updated value(s) to display the new value(s) - jEditable Configurations: you have the options to choose what to show up for an editable field. Such as a tooltip popup, what the submit button shows, or have a cancel button etc… you can see the full documentation on jEditable website.
If you want to pass multiple parameters, you can either use JSON or trick the ID to pass multiple fields. I have a hard time with JSON, so I tricked the ID part to pass multiple fields by using the PHP explode() function. For example:
1 | <div id="fieldname-<?=$id?>-tablename" class="editable">This is editable text</div> |
<div id="fieldname-<?=$id?>-tablename" class="editable">This is editable text</div>
Newb, but works.