how to get auto generated id of multiple controls in asp.net mvc?

Question

I have buttons and a dropdown being generated dynamically. I want to access the dropdown's ID at the page loading time but the Id generated automatically only gives me the first dropdown's id(please look at the script). and please if you can tell me how to indent the code properly

<div class="row">
<div class="col-md-9">
<div data-id="@data.id" id="Monday_@data.id">
@foreach (var slot in data.avail_slots)
{
if (slot.day == "Monday"){
<div class="col-md-3 col-xs-4" style="line-height:2em;">
<button id="appointment_click" data-toggle="modal" data-target="#confirmation" style="margin-bottom:4px" class="pull-left btn btn-pill btn-primary">@slot.time</button>
</div>
}}
</div>
<div data-id="@data.id" id="Tuesday_@data.id">
@foreach (var slot in data.avail_slots)
{if (slot.day == "Tuesday")
{<div class="col-md-3 col-xs-4" style="line-height:2em;">
<button id="appointment_click" data-toggle="modal"data-target="#confirmation" style="margin-bottom:4px" class="pull-left btn btn-pill btn-primary">@slot.time</button>
</div>
}
}
</div>
<div data-id="@data.id" id="Wednesday_@data.id">
@foreach (var slot in data.avail_slots)
{if (slot.day == "Wednesday")
{
<div class="col-md-3 col-xs-4" style="line-height:2em;">
<button id="appointment_click" data-toggle="modal" data-target="#confirmation" style="margin-bottom:4px" class="pull-left btn btn-pill btn-primary">@slot.time</button>
</div>
}
}
</div>
<div data-id="@data.id" id="Thursday_@data.id">
@foreach (var slot in data.avail_slots){
if (slot.day == "Thursday"){
<div class="col-md-3 col-xs-4" style="line-height:2em;">
<button id="appointment_click" data-toggle="modal" data-target="#confirmation" style="margin-bottom:4px" class="pull-left btn btn-pill btn-primary">@slot.time</button></div>
}}
</div>
<div data-id="@data.id" id="Friday_@data.id">
@foreach (var slot in data.avail_slots){
if (slot.day == "Friday"){
<div class="col-md-3 col-xs-4" style="line-height:2em;"> 
<button id="appointment_click" data-toggle="modal" data-target="#confirmation" style="margin-bottom:4px" class="pull-left btn btn-pill btn-primary">@slot.time</button>
</div>
}}
</div>
<div data-id="@data.id" id="Saturday_@data.id">
@foreach (var slot in data.avail_slots){
if (slot.day == "Saturday") {
<div class="col-md-3 col-xs-4" style="line-height:2em;">
<button id="appointment_click" data-toggle="modal" data-target="#confirmation" style="margin-bottom:4px" class="pull-left btn btn-pill btn-primary">@slot.time</button></div>
}
}
</div>
<div data-id="@data.id" id="Sunday_@data.id">
@foreach (var slot in data.avail_slots){
if (slot.day == "Sunday"){
<div class="col-md-3 col-xs-4" style="line-height:2em;">
<button id="appointment_click" data-toggle="modal" data-target="#confirmation" style="margin-bottom:4px" class="pull-left btn btn-pill btn-primary">@slot.time</button></div>}}
 </div>
 </div>         
 <div class="col-md-3">
 <select data-id="@data.id" id="days_@data.id" class="temp">
@foreach (var d in ad_list){
<option value="@d.id">@d.day_name</option>}
</select>
</div>

<script>
var today_number = new Date().getDay();
var today = get_all(today_number)
$('select>option:eq(' + today_number + ')').attr('selected', true);
var id = $('.temp').attr('data-id');


</script>

i am using data-id to give them different ids. i can't access it on page load — Zawar, Aug 03 '16 at 07:28

score 0 · Answer 1 · answered Aug 03 '16 at 07:36

The <select data-id="@data.id" id="days_@data.id" class="temp"> statement is outside the foreach loop. If you intend to generate multiple dropdowns, then put the select statement inside the foreach loop, as below:

@foreach (var d in ad_list)
{
    <select data-id="@data.id" id="days_@data.id" class="temp">
        <option value="@d.id">@d.day_name</option>
    </select>
}

score -1 · Answer 2 · edited May 23 '17 at 12:08

-1

You need to look at the Id's being generated at the moment the page has lots of the same Id's which will cause you issues.

However there is only one ddl and you don't need a dynamically generated id on it. It is outside of your loops.

If you do need to dynamically generate Id's take a look at here

edited May 23 '17 at 12:08

Community

1
1

answered Aug 03 '16 at 07:42

Glenn Packer

212
1
8

how to get auto generated id of multiple controls in asp.net mvc?

2 Answers2