CODEWITHSUNDEEP
jquerylaraveljquery-chosen
Diego Baulde
Diego Baulde

Reputation: 15

Problems with "Chosen select" in Laravel

Hello how are you? I am having an inconvenience with a dynamic select, in which I charge the "matriz", and depending on whatever a second select charges me with the "ensayos". In the "create" form there is no problem, the problem is in the "edit" form, since when I start editing I must show the data of the selected field in "matriz" so if I have to change the Assays do not make a selection of these according to the "matriz" preloaded. For example, if when I entered the sample I put in "matriz": Water, when I enter the edit form, so that the selection of "ensayos" takes the changes, I must select another "matriz" (ex: Food) and again select "Water" so that the filter is generated again in the "ensayos" field and be able to select only the water tests.

I leave the code so you can see what I say:

<div class="form-group">
   <label for="matriz">Matriz:</label><br>
     <select class="chosen-select" name="matriz_id" id="matriz">
        <option disabled selected>Seleccionar Matriz</option>
           @foreach($matrizs as $matriz)
               <option value="{{$matriz->id}}" @if(($muestra->matriz_id) == ($matriz->id)) selected="selected" @endif>{{$matriz->matriz}}</option>
           @endforeach
     </select>
</div>

<div class="form-group ml-4">
   {!! Form::Label('ensayo_id', 'Ensayos:') !!}
       <select class="chosen-select" name="ensayo_id[]" id="ensayos" multiple="multiple" style="width: 950px">
           @forelse($selects as $sel)
               @foreach($ensayos as $ensayo)
                   <option value="{{$ensayo->id}}" @if(($sel->ensayo_id) == ($ensayo->id)) selected="selected" @endif>{{$ensayo->ensayo}}</option>
               @endforeach
           @empty
               @foreach($ensayos as $ensayo)
                   <option value="{{$ensayo->id}}">{{$ensayo->ensayo}}</option>
               @endforeach
           @endforelse
       </select>
</div>

And this is the code in jQuery:

$('#matriz').change(function(e){
    var matriz_id = e.target.value;
    $.get('/dsa/public/lab/muestras/'+matriz_id+'/ensayos', function(data){ 
        $('#ensayos').empty();       
        var html_select = '';
        for (var i=0; i<data.length; ++i)
        html_select += '<option value="'+data[i].id+'">'+data[i].ensayo+'</option>';
        $('#ensayos').html(html_select);
        $('#ensayos').chosen();
        $('#ensayos').trigger("chosen:updated");   
    });
});

I tried to make a change in:

$('#matriz').change(function(e)

Changing to:

$('#matriz').ready

but didn't work.

Can you think of how I can fix this? From already thank you very much

Upvotes: 0

Views: 453

Answers (1)

dns_nx
dns_nx

Reputation: 3953

If I understand your problem correctly, I think, you can load the entries of ensayos when the page load is finished and the correct value is being set in field matriz. I only changed two lines comparing to your code. Run this code, when document is loaded:

$(document).ready(function() {

and then read the selected value of matriz

var matriz_id = $('#matriz').val();

Try this code:

$(document).ready(function() {
    var matriz_id = $('#matriz').val();
    $.get('/dsa/public/lab/muestras/'+matriz_id+'/ensayos', function(data) { 
       // here your code as above
       ...
});

Upvotes: 1

Related Questions