jQuery each onclick not working well

Posted 7 months ago by pordonez

Hello, i have a multiple field groups with the same id please see below.

<div class="form-group"> <!-- Set 1 -->
<input type="text" class="form-control" id="time_h" />
<input type="text" class="form-control" id="time_m" />
<button class="btn" type="button" id="start_time">Start</button>
</div>
---
<div class="form-group"> <!-- Set 2 -->
<input type="text" class="form-control" id="time_h" />
<input type="text" class="form-control" id="time_m" />
<button class="btn" type="button" id="start_time">Start</button>
</div>
---
<div class="form-group"> <!-- Set 3 -->
<input type="text" class="form-control" id="time_h" />
<input type="text" class="form-control" id="time_m" />
<button class="btn" type="button" id="start_time">Start</button>
</div>

no when i tried to fill up the forms with this sequence set 1, set 2, set 3 the functions are working. but when i tried it with this set 2, set 3, set 1, only the set 1 will work. 2 and 3 are blank.

here is my jQuery script

$('#start_time').on('click', function() {

$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});

var hr = $('#time_h').val();
var min = $('#time_m').val();

alert(hr + ' ' + min);

});

Please sign in or create an account to participate in this conversation.

Reply to

Use Markdown with GitHub-flavored code blocks.