Problem with dynamic selector undefined

Question

Problem with dynamic selector undefined

Navigation

#1 by (0 votes)

0

Hi, I have a problem with my dynamic selector, it works correctly, except that it does not show me the values in the second select, I think the problem is in the java script code when printing the value in each select since I iterates correctly the number of semesters but does not show its value

Javascript code

$(function() {
    $('#select-carrera').on('change', onselectcarrerachange);
});

function onselectcarrerachange() {

    var pensum_id = $(this).val();


    if (!pensum_id) {
        $('#select-semestre').html('<option value "">Seleccione un semestre</option>') return
    }

    $.get('/api/nueva-seccion/' + pensum_id + '/semestres', function(data) {

        var html_select = '<option value "">Seleccione un semestre</option>';
        for (var i = 0; i < data.length; ++i) html_select += '<option value="' + data[i].id + '">' + data[i].name + '</option>';
        $('#select-semestre').html(html_select);
    });
}

Html selectors

    <div class="form-group col-sm-8">
     <div class="input-group"   title="Carrera">
    <span class="input-group-addon"><i class="fa fa-graduation-cap" aria-hidden="true"></i>
    </span>


    <select  class="form-control"   id="select-carrera">

    <option  value="">Seleccione carrerra    </option>
    @foreach ($pensum as $n)
    <option  value="{{$n->id}} "> {{$n->carrera}} | Regimen: {{$n->regimen}} |  Vigencia: {{$n->vigencia}}  </option>

    @endforeach

    </select>


    </div>
    </div>




<div class="form-group col-sm-8">
<div class="input-group">
<span class="input-group-addon"  title="Semestre" ><i class="fa fa-filter" aria-hidden="true"></i>
</span>



  <select  class="form-control"   id="select-semestre">
<option  value="">Semestres</option>

</select>



</div> 
</div>

Capture my console with a console.log (data);

[! [enter the description of the image here] [2]] [2]

Console.log before the for

console.log(data);
var html_select='<option value "">Seleccione un semestre</option>';
for ( var i =0 ; i<data.length; ++i) 
    html_select +='<option value="'+data[i].id+'">'+data[i].name+'</option>';
$('#select-semestre').html(html_select);
});

Result

javascript json ajax laravel

asked by Jcastillovnz 03.11.2017 в 02:33

source

1 answer

Improve performance when ordering array Timepicker error

score 0 · Accepted Answer

Your json's response does not have an appropriate name defined by what undefined does.

The response has only the following properties defined:

{
 id: Number,
 semestre: String,
 penum_id: Number,
 created_at: String,
 updated_at: String
}

You have to add the name property to your answer on the server to make it work.

Update:

If you want to print the semester field, then change data[i].name by data[i].semestre :

var html_select='<option value "">Seleccione un semestre</option>';
for ( var i =0 ; i<data.length; ++i) 
    html_select +='<option value="'+data[i].id+'">'+data[i].semestre+'</option>';
     $('#select-semestre').html(html_select);
});