Create a variable name with another variables contents

Question

Each time a field that has the class of 'required' is changed I want to set a timeout. My original script had a bug where if you move onto another field with the same class before the timeout is complete it resets it and only carrys out the function on the last field. To combat this, I want to add the name of the specific field to the timer function. However my attempt below doesn't work. I am thinking if there is a timer for each field it should work. Firstly, is my method correct? and if so what am I doing wrong? If not, how can I achieve my goal?

$('.required', this).bind('keyup change',function() {
    var fieldName = $(this).attr('name');
    var timer[fieldName] = null;
    clearTimeout(timer[fieldName]);
    timer[fieldName] = setTimeout(
        function() {
            if( !$(this).val() ) {
                $(this).nextAll('.required-prompt').first().remove();
                $(this).after(prompt);
            } else {
                $(this).nextAll('.required-prompt').first().remove();
                required = true;
            }   
        }
        , 2000
    );
});

isn't timer undefined here or you are declaring it somewhere else?! — A. Wolff
– A. Wolff, Commented Jan 13, 2014 at 10:25
@A.Wolff timer is defined on line 3 above, so it's scope is in the function. — user1932079
– user1932079, Commented Jan 13, 2014 at 10:25
@JeremyMiller No, it is not! BTW, this is not valid syntax, using var — A. Wolff
– A. Wolff, Commented Jan 13, 2014 at 10:26
@A.Wolff Spot on! Good catch... can't believe I didn't see that! — user1932079
– user1932079, Commented Jan 13, 2014 at 10:30

A. Wolff · Accepted Answer · 2014-01-13 10:29:02Z

3

Code should be like this:

var timer = {};
$('.required', this).bind('keyup change',function() {
    var fieldName = $(this).attr('name');
    clearTimeout(timer[fieldName]);
    timer[fieldName] = setTimeout(
        function() {
            if( !$(this).val() ) {
                $(this).nextAll('.required-prompt').first().remove();
                $(this).after(prompt);
            } else {
                $(this).nextAll('.required-prompt').first().remove();
                required = true;
            }   
        }
        , 2000
    );
});

answered Jan 13, 2014 at 10:29

A. Wolff

74.4k9 gold badges98 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

user2889310 Over a year ago

Hi. Thank you. I have tried this, but its giving an error of 'TypeError: f.nodeName is undefined' in the jquery library. Any ideas?

A. Wolff Over a year ago

Your FIELD as a name attribute? What about providing relevant HTML code and a jsfiddle?!

user2889310 Over a year ago

Fixed it myself. Thank you.

Collectives™ on Stack Overflow

Create a variable name with another variables contents

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related