Daniel Lopez
Daniel Lopez

Reputation: 1

Does html takes same id on the same object

I have a html code built in parts, each part have a button with and unique id, each button has an event, if I display the main html each button works, if I display a part of that html the buttons does not work

Do I need to create different id's to each button to each part of the html ?

 if(otcs[i].clase[j].valor==1)                                  
     {
      htmlOtsSistemasCCTV +='  <br><li class="search-result-block" data-id="14"/> <div class="search-result-block"><div class="image-block hover-fader"><img src="'
          +otcs[i].clase[j].servicio[k].ser_img_32
          +'"  alt="image01" />   </div>  <div class="url text-green"><strong>  OTC 2015-'
          +otcs[i].clase[j].servicio[k].valor
          +'  </strong> </div> <p class="desc">'
          +otcs[i].clase[j].servicio[k].texto
          +'</p> <div class="btn-group">  <div class="btn-group btn-group-xs "><button type="button" class="btn btn-primary" id="'
          +i+"-"+j+"-"+k
          +'" > <span class="glyphicon glyphicon-play"></span> PROCESO</button></div> <div class="btn-group btn-group-xs"> <button  type="button" class="btn btn-warning" onClick="pausarServicio()" id="pausarOtc'
          +otcs[i].clase[j].servicio[k].valor
          +'"> <span class="glyphicon glyphicon-pause"></span>    TRASLADO</button> </div> <div class="btn-group btn-group-xs"> <button type="button" onClick="confirmarTerminado(\'#1290\')" class="btn btn-success" id="confirmarOtc'
          +otcs[i].clase[j].servicio[k].valor
          +'">       <span class="glyphicon glyphicon-stop"></span> TERMINAR</button>     </div>  <div class="btn-group btn-group-xs"> <button type="button" onClick="reprogramarServicio()" class="btn btn-danger" id="reprogramar'
          +otcs[i].clase[j].servicio[k].valor+'" > <span class="glyphicon glyphicon-fast-backward"></span> REPROGRAMAR</button> </div> <div class="btn-group btn-group-xs"> <button type="button" onClick="confirmarFalla()" class="btn btn-info" id="confirmaFalla'
          +otcs[i].clase[j].servicio[k].valor
          +'" > <span class="glyphicon glyphicon-wrench"></span> DIAGNOSTICO </button> </div>                  </div>                 </div>               </li>' ; 

                                                }

then...

 htmlOtsSistemas = htmlOtsSistemasCCTV + htmlOtsSistemasSSCA ......

an then ...

 $('#Sistemas').on('click',function(){  "soo the button here work"

                                $('#lista2').html(htmlOtsSistemas);

             });

                            $('#CCTV').on('click',function(){ " the buttons here do not work

                                  $('#lista2').html(htmlOtsSistemasCCTV);

                                });

Upvotes: 0

Views: 34

Answers (1)

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167250

If you are using multiple buttons on the same page, all the IDs must be unique. IDs cannot be shared among the elements. If you need to group a specific set of elements, use class instead of id.

You also have a option of generating dynamic IDs too!

Upvotes: 1

Related Questions