I really like the jQuery jeditable plugin for editing data inline. It’s quick to install and set up and easy to use and I usually have no problems.
But, today I’ve run into a real problem. I’ve finally found a work around, but I still think there’s a bug of some kind in the code.
I had a form which had several divs floated left inside one large div. All of my jeditable spans in the first div which is floated furthest left appears to be working fine. But, the spans in the next div (and subsequent divs) won’t work after the first edit.
In other words, if I edit the text, hit enter to save and then edit the same text again, the edit box is empty and uneditable.
I finally fixed it. I don’t know why this works, but it does. I had this:
Expiration Date: <span class="edit" id="id_1">09/2015</span>
I changed it to this:
<span style="float:left">Expiration Date: </span> <span style="float:left; padding-left:5px;" class="edit" id="id_1">09/2015</span>
Works like a charm! The float:left did it!