CODEWITHSUNDEEP
jquery
Ivan
Ivan

Reputation: 2481

Input fields don't get the correct values from a data-default attribute

I have some table rows with input fields; for each field I set a data-default attribute: in case of input change, I have a way to go back to default value picking the data-default value

For each row I also have a checkbox: if checked, fields value go to '0:00' (it's a "hour:minutes" format); if unchecked, values should go back to default

Here comes the problem: when unchecked, the input fields DON'T switch to default value, but get empty. This is my code:

$('.cb').click(function(){
    var el = $(this);
    var parent = el.closest('tr');
    if (el.is(':checked')) {
        parent.find('.timepicker').val('0:00');
    } else {        
        parent.find('.timepicker').val($(this).data('default'));
    }
});

And here's the JS fiddle: http://jsfiddle.net/w17ffqxy/

Please, any help?

Upvotes: 1

Views: 40

Answers (2)

AmmarCSE
AmmarCSE

Reputation: 30557

This is because you are attempting to access data('default') on the checkbox itself when it doesnt have that attribute. You need to access the .timepicker like

parent.find('.timepicker').val(function() {
        return $(this).data('default');
    });

DEMO

Upvotes: 3

Abhishekh Gupta
Abhishekh Gupta

Reputation: 6236

You can try this:

$('.cb').click(function(){
    var el = $(this);
    var parent = el.closest('tr');
    if (el.is(':checked')) {
        parent.find('.timepicker').val('0:00');
    } else {        
        parent.find('.timepicker').each(function(){
            $(this).val($(this).attr('data-default'));
        });
    }
});

Here is the DEMO.

Upvotes: 4

Related Questions