CODEWITHSUNDEEP
javascriptjquery
Milano
Milano

Reputation: 18745

Use timepicker plugin on dynamically created inputs

I use bootstrap-material-datetimepicker as a plugin to pick up time in my form.

The problem is that this form is dynamically loaded from server so it doesn't do anything when user clicks on input field. It works correctly only if the form isn't dynamically loaded.

    $(document).ready(function () {
        ...
        $('#id_time_from').bootstrapMaterialDatePicker({date: false, format: "HH:mm"});

The problem is that the plugin window is not being called directly through some click event, instead you do:

Element.bootstrapMaterialDatePicker({date: false, format: "HH:mm"});

How can I make it work for dynamically generated inputs?

Upvotes: 0

Views: 61

Answers (1)

mdeora
mdeora

Reputation: 4542

When you load the form, at the same time you attach the bootstrapMaterialDatePicker to the form element. i,e load your script element along with the dynamic form loading. That should work fine.

Eg. 

<form>
 ...
 ...
 <button id="id_time_from"> </button>
<script> 
$('#id_time_from').bootstrapMaterialDatePicker({date: false, format: "HH:mm"});
</script>
 ...
 ...
</form>

Upvotes: 1

Related Questions