$(document).ready(function(){
var urlBase = "http://fipeapi.appspot.com/api/1/";
$("#marcas").hide();
$("#veiculos").hide();
$("#ano").hide();
$("#tipo").change(function(){
$("#marcas").hide();
$("#veiculos").hide();
$("#ano").hide();
$.getJSON(urlBase + $("#tipo").val() + "/marcas" + ".json", function( data ){
var items = ["<option value=\"\">ESCOLHA UMA MARCA</option>"];
$.each(data, function (key, val) {
items += ("<option value='" + val.id + "'>" + val.name + "</option>" );
});
$("#marcas").show();
$("#marcas").html(items);
});
});
$("#marcas").change(function(){
$("#veiculos").hide();
$("#ano").hide();
$.getJSON(urlBase + $("#tipo").val() + "/veiculos/" + $(this).val() + ".json", function( data ){
var items = ["<option value=\"\">ESCOLHA UM VEICULO</option>"];
$.each(data, function (key, val) {
items += ("<option value='" + val.id + "'>" + val.name + "</option>" );
});
$("#veiculos").show();
$("#veiculos").html(items);
});
});
$("#veiculos").change(function(){
$("#ano").hide();
$.getJSON(urlBase + $("#tipo").val() + "/veiculo/" + $("#marcas").val() + "/" + $(this).val() + ".json", function( data){
var items = ["<option value=\"\">ESCOLHA O ANO</option>"];
$.each(data, function (key, val) {
items += ("<option value='" + val.id + "'>" + val.name + "</option>" );
});
$("#ano").show();
$("#ano").html(items);
});
});
$(this).change(function(){
$("#selecao").html("Marca: " + $("#marcas option:selected").text() + " Veiculo: " + $("#veiculos option:selected").text() + " Ano: " + $("#ano option:selected").text())
});
});
I made this code based on your previous code, but as I noticed the link is out of the air I used this http://fipeapi.appspot.com/
Only that different from its code, already inserted the choice of cars, motorcycles and trucks so not having the need to create one for each type.
I hope you can help, because your code has helped me a lot to reach this conclusion.
Are also inserted .hide
and .show
as I select the select field, I’m still starting with jQuery, I don’t have many skills, but stay there in case you need.
Speak Felipe, my problem is more connected in the print of my jQuery, which was not working.
– Giulio Costa
Managed to solve?
– Felipe Elia
Yes, I answered below, thanks for the help.
– Giulio Costa