Problem with jQuery ui and select2

0

At the moment I'm trying to solve a problem I have and that is when you activate the function datepicker of jQuery ui and% select2 only take me the first box of the table, can you help me as I do so that I put the attributes of select2 and jQuery ui to all the results that come out? I'll leave the code to see what I have bad.

This is the code of Laravel with which I make the query

@foreach($pedidos as $pedido)
    @if($pedido->granja_id == $g->granja_id)
        @if($pedido->fecha_entrega == 'por verificar' || $pedido->conductor_asignado == 'por verificar' || $pedido->vehiculo_asignado == 'por verificar')
            @if(Auth::User()->rol_id == 10)
                <tr>
                    <td> 
                        <a href="{{ route('admin.pedidoConcentrados.show', $pedido->consecutivo) }}">
                            <strong>PCO{{ $pedido->consecutivo }}</strong>
                        </a>
                    </td>

                    <td>{{ $pedido->nombre_granja }}</td>
                    <td>{{ $pedido->fecha_creacion }}</td>
                    <td> {{$pedido->fecha_estimada}} </td>
                    @if($pedido->estado_id == 1)
                        <td><strong style="color: #FDAE05;"> En Tramite </strong></td>
                    @elseif($pedido->estado_id == 2)
                        <td><strong style="color: #8BC34A;"> Tramitado </strong></td>
                    @endif
                    <td>
                        <strong>
                            <input id="modificar_fecha_pedido_concentrados" class="form-control" type="text" name="conductor" value="{{ $pedido->fecha_entrega }}" readonly="true" />
                        </strong>
                    </td>
                    <td>
                        <select name="conductor" class="form-control" id="cd" selected="selected" />
                            @if($pedido->conductor_asignado == 'por verificar')
                                <option value="por verificar">{{ $pedido->conductor_asignado }}</option>
                                @foreach($conduct as $c)
                                    <option value="{{$c->id}}">{{$c->nombre}}</option>
                                @endforeach
                            @else
                                @foreach($conduct as $c)
                                    @if($pedido->conductor_asignado == $c->nombre)
                                        <option value="{{$c->id}}">{{$c->nombre}}</option>
                                    @endif
                                @endforeach
                                @foreach($conduct as $c)
                                    <option value="{{$c->id}}">{{$c->nombre}}</option>  
                                @endforeach
                            @endif
                        </select>
                    </td>
                    <td> 
                        <select name="conductor" class="form-control" id="vh" selected="selected">
                            @if($pedido->vehiculo_asignado == 'por verificar')
                                <option value="por verificar">{{ $pedido->vehiculo_asignado }}</option>
                                @foreach($vehicul as $v)
                                    <option value="{{$v->id}}">{{$v->placa}}</option>
                                @endforeach
                            @else
                                @foreach($vehicul as $v)
                                    @if($pedido->vehiculo_asignado == $v->placa)
                                        <option value="{{$v->id}}">{{$v->placa}}</option>
                                    @endif
                                @endforeach
                                @foreach($vehicul as $v)
                                    <option value="{{$v->id}}">{{$v->placa}}</option>
                                @endforeach
                            @endif
                        </select> 
                    </td>
                    <td> 
                        <a href="#" class="btn btn-primary" id="validar" onclick="enviarCampos({{ $pedido->consecutivo }});"><i class="fa fa-check"></i> Validar</a>
                    </td>
                </tr>
            @endif
        @endif
    @endif
  @endforeach

With this little code of javascript I do the function of establishing the attributes but it only takes the first row and puts the attributes but from then to below they are normal

$(document).ready(function () {
    $("#cd").select2();
    $("#vh").select2();
    $("#modificar_fecha_pedido_concentrados").datepicker({
        changeMonth: true,
        changeYear: true,
        yearRange: "1950:2100",
        dateFormat: "yy-mm-dd",
        showButtonPanel: true,
    });
});

With this code I set the attributes of the libraries but the problem is that I'm just taking the first row

if you notice that the two selects are different from the ones below it is because they have the attributes of the library select2 and the first input have the attribute of jQuery ui but the second one does not. / p>     

asked by Juan Esteban Yarce 17.04.2018 в 18:41
source

1 answer

1

Your problem is in these lines:

$("#cd").select2();
$("#vh").select2();
$("#modificar_fecha_pedido_concentrados").datepicker({

You are using ids to identify several elements. The ids are supposed to be unique throughout the DOM. The solution is to use classes instead of ids.

    
answered by 17.04.2018 / 18:45
source