DOUBT can I make more than one ajax request on the same page?

Asked

Viewed 1,676 times

1

I am doing a search in the database and returning this data in a table via ajax, there is in this same table a column that has a link that returns more information about the data, all this by ajax. The first ajax request happens as expected, but the second request the data appears and disappear from the screen quickly, I noticed that because I put an Alert in ajax.responseText. My question is whether I can execute two ajax requests on the same page. My js code is this Aki.

function mostrar_fase()
    {
    ajax = xmlhttp();
    id_fase = document.getElementById('id_fase').value; 

    if(ajax)
    {               
        ajax.open("GET",'http://localhost/sac/Ajax/mostrar_fase/' + id_fase, true);     
        ajax.onreadystatechange = function() 
        {       
            if (ajax.readyState == 4 && ajax.status == 200)             
            {                       
                document.getElementById("resposta").innerHTML = ajax.responseText;              

            }
        }
         ajax.send();
    }
}

The impression I have is that I must reset some variable in the first ajax request. I don’t know what else it would be. This code I posted is from the second request, but the first is very similar to this only changes a variable and the link. Thank you since.

  • You can use as many ajax calls as you want. What you need to decide is where the content goes, what you send to the server (and how that conditions the response) and how to display the content. Right now you’re overwriting the element #resposta is that what you want? and you don’t need to send your data to the specific call?

  • #reply represents a div that I have in html code menu and I want to rewrite, the data I need is consulted in the data group by the page that is in ajax.open, and the query data is returned as I need, because I put an Alert in my code to verify it. The problem is that the data appears and then disappears from the screen.

  • What are you calling that function mostrar_fase()?

  • is inside a table column, thus <td><a href="" onclick="Return mostrar_fase()" class="Tiny button">Show more</a></td>

  • If you look at Speed Tools how often the ajax is called? Does it match sometimes you want? it is difficult to guess without having an example of the problem... can you make a jsFiddle with the problem? or at least with your code?

1 answer

2

Yes it is possible, i personally recommend using jQuery as it becomes easier to create requests via Ajax.


I have developed a small code that demonstrates two ajax requests for the same page.

HTML & JS:

<html>

    <body>

        <button id="calc1">1+2</button>
        <button id="calc2">1+3</button>

        <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
        <script>
            $("#calc1").click(function(){
                $.ajax({
                    type: "GET",
                    url: "test.php",
                    data: { x:"1", y:"2"},
                    success: function (data){
                        alert(data);
                    }
                })
            });

            $("#calc2").click(function(){
                $.ajax({
                    type: "GET",
                    url: "test.php",
                    data: { x:"1", y:"3"},
                    success: function (data){
                        alert(data);
                    }
                })
            });

        </script>   
    </body> 
</html>

PHP:

<?php

$x = $_GET['x'];
$y = $_GET['y'];

echo $x+$y;

You can use the code and test it and verify that both requirements are executed without any problems, it is up to you to adapt the code.

Browser other questions tagged

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