Search code examples
jqueryjeditable

JEditable - Reset values


This might be an easy thing to do that I missed, but I cannot find a way to "reset" the value in a JEditable field. I let the user edit three fields, then press a button to save those three together. This works fine, but once it's done, I would like to reset my jEditable fields so they have no values and display their placeholder again. The three values entered by the user are displayed somewhere else.

I tried to do $("#myfield").editable('reset'), but that didn't work.

The only way I found was to call .empty() on those fields and set .editable all over again with my callback function and my settings, but I find this a bit messy.

Any other way?

As requested, here's an example in Fiddle of what I want to do:

Thanks!


Solution

  • Just do something like this...

    A little more specific:

    $('.editable').editable('http://www.example.com/save.php', { 
         type     : 'textarea',
         submit   : 'OK',
         callback : function(value, settings) {
             $("#myfield").text('');
         }
    });
    

    I think there is a lot to improve but it's a working version :) Here is what i've done so far: http://jsfiddle.net/Wz8x9/3/

    Nothing special here. I've just stored the default field value in a data attribute...

    <div id="field1" data-placeholder="First Name"></div>
    

    Now you can access the value like this:

    $('#field1').html($('#field1').attr('data-placeholder'));