Return ASP 3 array and select popular with each JQUERY

Asked

Viewed 289 times

1

I need to popular a select (Html). I believe the step would be this, but how to do it? Someone has a link that can direct me?

  1. Click on select (Onchange maybe)
  2. Put the Query (Query) data into ASP in this Array
  3. Return this Array to JQUERY and popular through Each.

The fuck is, how to create this array in ASP 3, and how to pass to JQUERY and read through Each.

Someone gives me a light on how to do?

  • What would be sent by Ajax?

  • @sam sent or brought by ajax? Sent an Asp page, brought two fields within an array for me to loop with each in Jquery. It would be popular for a select.

  • It seems to me that your problem is more in creating the array in ASP, because the rest is quite simple.

  • @sam the two. I am searching here how to put the data of a query in the array (ASP), it is difficult to find something. First I have to fix it, then I think about the JQUERY part.

  • This waiting array would be a simple array, like: array("item 1","item 2",...)?

  • @Sam then, I don’t know how it has to be, to work out there in Jquery.

  • @sam of I found something similar in php, maybe gave me a light.

  • @sam take a look at the chat

  • @sam spoke to you on chat. rs

Show 5 more comments

1 answer

1


You can call Ajax by clicking on select and pass the id of select clicked as parameter in the URL to be requested. This way you can control what information will be sent by ASP with request("id").

Create an event click that will detect the click on select and send via $.get the id of its element. The return of the ASP (we will see later) will return objects with two values each, separated by a comma, where a value will be the value and the other the text of option popularize the select clicked.

On the return of Ajax you convert these objects into JSON array with the method JSON.parse(), and using $.each you mount the HTML of option. After the $.each just play the HTML mounted into the select with .html().

Other explanations in the codes.

Example of select with a id:

<select id="cursos"></select>

Event and Ajax code:

$('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
      });
   }
});

Change pagina.asp by your ASP page.

Assembling objects in ASP and returning to Ajax:

In the ASP you get the id sent by Ajax with request("id"), and according to the value received, you mount the query to the database.

Make the normal loop of the query to the bank and place the response.write inside this loop assembling the objects that will be sent to Ajax. Example:

<%
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
%>

The ASP tab should only have the above code. It is not a normal page tagged.

  • It didn’t work. I put a link in the chat for you to see.

  • nothing yet, giving an Alert before that line the data is coming.

  • I’ll update jquery to see.

  • localhost ran uhuuuu. Now I want to see why not on the server

  • would need you to start one with valeu=" " (empty) leaving the user option not to select anything. Putting <option value="">Discipline (all)</option> in the select itself will not, so I have to do this before each in Jquery. That’s it?

  • can not, you have to come when loading the page and not when click on select. I tried to put in the own select, but then stop bringing.

  • because by putting it like this: <select id="discipline" > <option value="">Discipline (all)</option> </select>

  • he stops bringing, I don’t understand.

  • is because of the if I put rs.... change to if($('option', this).length == 1)... but also have to change the $('#'+id).html(opts); for $('#'+id).append(opts);

  • Dude, thanks. I’ll study more here and try to make some adjustments. Doing this if modification, sometimes it gives a bug, does not load, has to give two clicks.

  • only one last thing, which index function in function: Function(index, item)?

  • Blz... anything calls in there. That’s what you want to do is papaya with sugar. There doesn’t have to be no bug. It’s very simple: click on select, call Ajax. Now the ideal was to disable select until the Ajax response.

  • The index is the index of the array, starting from 0

  • got it. thanks a lot

Show 9 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.