Você pode chamar o Ajax clicando no select
e passar o id
do select
clicado como parâmetro na URL a ser requisitada. Desta forma você pode controlar quais informações serão enviadas pelo ASP com request("id")
.
Crie um evento click
que irá detectar o clique no select
e enviar via $.get
o id
do respectivo elemento. O retorno do ASP (veremos mais a frente) irá retornar objetos com dois valores cada, separados por vírgula, onde um valor será o value
e o outro o texto das option
a popularem o select
clicado.
No retorno do Ajax você converte esses objetos em array JSON com o método JSON.parse()
, e usando $.each
você monta o HTML das option
. Após o $.each
basta você jogar o HTML montado para dentro do select
com .html()
.
Demais explicações nos códigos.
Exemplo do select
com uma id
:
<select id="cursos"></select>
Código do evento e do Ajax:
$('select').click(function(){ // evento click
// este if verifica se o select já foi populado
// evitando que ele seja populado mais de uma vez
// ao ser clicado
if(!$('option', this).length){
$(this).prop("disabled", true); // desabilita o select
var id = this.id; // pega o id do select
var url_ = 'pagina.asp?id='+id; // monto a URL do Ajax passando o id como parâmetro para o ASP
$.get(url_, function(data){
// aqui é o retorno do Ajax
data = data.replace(/,$/, ''); // removo a última vírgula que virá
data = JSON.parse('[' + data + ']'); // converto os objetos em array JSON
var opts = ''; // declaro a variável que irá montar o HTML das options
$.each(data, function(index, item) {
// monto as options concatenando os valores de cada objeto
opts += '<option value="'+item.id+'">'+item.campo+'</option>';
});
$('#'+id).html(opts) // envio o HTML montado para o devido select
.prop("disabled", false); // habilita o select novamente
});
}
});
Troque pagina.asp
pela sua página ASP.
Montando os objetos no ASP e retornando para o Ajax:
No ASP você recebe o id
enviado pelo Ajax com request("id")
, e de acordo com o valor recebido, você monta a query ao banco de dados.
Faça o loop normal da consulta ao banco e coloque o response.write
dentro desse loop montando os objetos que serão enviados para o Ajax. Exemplo:
<%
conn = conexão com o banco
set rs = conn.execute(aqui a sua query)
if not rs.eof then
while not rs.eof
response.write("{""id"":"""& rs("coluna_id") &""",""campo"":"""& rs("coluna_campo") &"""},")
rs.movenext
wend
end if
rs.close
set rs = nothing
%>
A página ASP deverá ter apenas o código acima. Não é uma página normal
com tags.
array("item 1","item 2",...)
?