Jquery code doesnt work on html output from Javascript

Question

I have this Jquery function to mask my textbox:

  jQuery(function($){ //Mask textbox #hour with placeholder
   $("#hour").mask("9:99",{placeholder:"0"});
   $("#hourInTable").mask("9:99",{placeholder:"0"});
});

Works perfectly with this html code:

But when I try to do it in the textbox that has the ID hourInTable outputted by Jquery it doesnt mask anything:

jqTds[2].innerHTML = '<input type="text" name="hourInTable" id="hourInTable" value="00:00">';

This above code is called after a button press and the textbox hourInTable is placed somewhere on the page.

Placed this code direct into my html:

<input type="text" name="hourInTable" id="hourInTable" value="00:00">

And it worked, so its due to the html output in JS.

Thanks in advance.

Michal · Accepted Answer · 2014-01-03 11:18:48Z

4

Most likely it happens because when jQuery does the masking, the input is not yet present. Give the function a name and call it after you are sure that the innerHTML is placed.

answered Jan 3, 2014 at 11:18

Michal

7532 gold badges6 silver badges23 bronze badges

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

1 Comment

user2911924 Over a year ago

Perfect worked, stupid me for forgetting this. Thanks!

rajesh kakawat · Accepted Answer · 2014-01-03 11:21:11Z

1

try something like this

 jqTds[2].innerHTML = '<input type="text" name="hourInTable" id="hourInTable" value="00:00">';
 // call after text box is added
 $("#hourInTable").mask("9:99",{placeholder:"0"});

because #hourInTable is not present on DOM ready so it doesn't apply mask on it

call masking function after your dynamically created input is added

answered Jan 3, 2014 at 11:21

rajesh kakawat

10.9k1 gold badge24 silver badges40 bronze badges

Comments

Milind Anantwar · Accepted Answer · 2014-01-03 11:22:55Z

1

Add the masking code in function. And call it on button click which adds dom <input type="text" name="hourInTable" id="hourInTable" value="00:00"> in page.

answered Jan 3, 2014 at 11:22

Milind Anantwar

82.3k26 gold badges97 silver badges128 bronze badges

Collectives™ on Stack Overflow

Jquery code doesnt work on html output from Javascript

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related