Como adicionar instruções if ao Ajax - ajax, forms, dom, select

Eu faço principalmente programação PHP, mas estou preso em umProblema com Ajax, pois não conheço Javascript ou Ajax muito bem. Eu tenho um menu de seleção de combinação agora e gostaria de ocultar o terceiro menu de seleção (direção) se a primeira opção for = "trem". Eu li que alguns navegadores não suportam a função ocultar, então a próxima melhor opção é manter o terceiro menu de seleção desabilitado quando a segunda opção é escolhida, supondo que a primeira seja treinar. Se for um ônibus, o terceiro menu de seleção ainda deve ser exibido. Aqui está o meu javascript agora e, como tenho certeza que você pode imaginar, não funciona.

    $(document).ready(function(){
if ($("select#agency").attr("value") == "cta-train") {
$("select#direction").attr("disabled","disabled");
}

$("select#route").attr("disabled","disabled");
$("select#agency").change(function(){
$("select#route").attr("disabled","disabled");
$("select#route").html("<option>wait...</option>");
var id = $("select#agency option:selected").attr("value");
$.post("select_route.php", {id:id}, function(data){
$("select#route").removeAttr("disabled");
$("select#route").html(data);
});
});
});


$(document).ready(function(){
if ($("select#agency").attr("value") == "cta-train") {
$("select#direction").attr("disabled","disabled");
}
else {
$("select#direction").attr("disabled","disabled");
$("select#route").change(function(){
$("select#direction").attr("disabled","disabled");
$("select#direction").html("<option>wait...</option>");
var id = $("select#route option:selected").attr("value");
$.post("select_direction.php", {id:id}, function(data){
$("select#direction").removeAttr("disabled");
$("select#direction").html(data);
});
});
}
});

Qualquer ajuda seria muito apreciada!

Respostas:

Parece que você não quer o ajax, você deseja usar javascript para ocultar um select se outro select tiver um certo elemento nele. Em seguida, use seu ajax para arquivar a seleção conforme necessário. Aqui está um exemplo disso http://jsfiddle.net/2FQwQ/

<select id="direction">
<option value="train">train</option>
<option value="car">car</option>
<option value="pogo stick">pogo stick</option>
<select>

<select id="agency">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<select>

<select id="route">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<select>

Roteiro

//SEts your html up to hide the secelt if train
function amITrain() {
if ($("#direction").val() === "train"){
$("#route").hide();
$("#route").attr("disabled");
}else{
$("#route").show();
$("#route").removeAttr("disabled");
}
}
$("#direction").change(amITrain);


//When you get the ajax back, you would fill the select like this, then call the function
$("#direction").html("<option value="train">train</option><option value="car">car</option>     <option value="pogo stick">pogo stick</option>");
amITrain();