While with PHP and Datapicker

0

I have a page that is fed with information from the Mysql Database. This page also contains an Input Text with dataPicker calendar. The problem is that only the first line of the looping works with DataPicker, the others do not.

Form:

    while($fetch = mysql_fetch_assoc($xxx)){ 

     <input  name="protocolo" id="protocolo" type="text" 
     placeholder="00/00/0000" 
     style="width:100px;font-size: 13px" class="form-control input-md">

DataPicker

<script type="text/javascript">
$(document).ready(function(e) {
    $("#protocolo").datepicker({
        dayNamesMin: ['D','S','T','Q','Q','S','S','D'],
        dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb','Dom'],
        dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','Sexta','Sábado'],
        monthNamesShort: ['Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set','Out','Nov','Dez'],
        monthNames: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
        dateFormat: 'yy-mm-dd',
        nextText: 'Próximo',
        prevText: 'Anterior'
    });
});
</script>
     } ?>

Both are within the While, I tested putting the DataPicker out of the white, but the problem remains, only the first line of While opens the calendar, the others do not.

    
asked by anonymous 19.02.2018 / 18:22

1 answer

0

The ID attribute must be unique. When you have more than two elements with the same ID attribute. JavaScript will consider only the first one.

Instead of using ID , use other attributes like class , data-* etc.

Ex:

while($fetch = mysql_fetch_assoc($xxx)){ 
    <input name="protocolo[]" type="text" 
            placeholder="00/00/0000" 
            style="width:100px;font-size: 13px" class="form-control protocolo input-md"/>
}

JavaScript:

<script type="text/javascript">
$(document).ready(function(e) {
    $(".protocolo").datepicker({
        dayNamesMin: ['D','S','T','Q','Q','S','S','D'],
        dayNamesShort: ['Dom','Seg','Ter','Qua','Qui','Sex','Sáb','Dom'],
        dayNames: ['Domingo','Segunda','Terça','Quarta','Quinta','Sexta','Sábado'],
        monthNamesShort: ['Jan','Fev','Mar','Abr','Mai','Jun','Jul','Ago','Set','Out','Nov','Dez'],
        monthNames: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho','Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
        dateFormat: 'yy-mm-dd',
        nextText: 'Próximo',
        prevText: 'Anterior'
    });
});
</script>

The same goes for the name attribute. When you submit the form, only one of the values will be sent the repeated ones will be discarded, so you should use name="protocolo[]"

    
19.02.2018 / 18:26