Clever Geek Handbook

JQuery Return links not working when Ajax

JQuery backlinks don't work. I used jQuery and a basic Ajax function. My jQuery is returning links from a file Links_ajax.php

.

I am giving code samples.

GetCustomerData.php has:

<html>
    <script type="text/javascript">
    <script src="ajax.js" type="text/javascript">

        $(function() {
            .....

            $.ajax({
                type: 'POST',
                url: 'Links_ajax.php',
                data: 'category='+category  ,
                success: function(data){
                    $("#response").html(data);
                }
            });
        }
        ......
    }

    ...

    <! Links return here
        <div id="response">
        </div>
</html>

<?
  echo "Some Code";


?>

  ....

My Links_ajax.php has the following code

....

echo '<a href="getCustomerData.php?id=10" onclick="requestCustomerInfo();return false;">show me </a>';
echo '<a href="getCustomerData.php?id=11" onclick="requestCustomerInfo();return false;">show me </a>';

....

Now I go to the getCustomerData.php main page. I used an Ajax function that returns a link from Links_ajax.php.

 .....

So my ajax.js has the following Ajax scripts.

var url = "GetCustomerData.php?id="; // The server-side script
function handleHttpResponse() {
    if (http.readyState == 4) {
        if (http.status == 200) {
            var results = http.responseText;
            document.getElementById('divCustomerInfo').innerHTML = results;
        }
    }
}

function requestCustomerInfo(event) {
    if(event &&event.preventDefault) event.preventDefault();
    else if (window.event && window.event.returnValue)
        window.eventReturnValue = false;
        var sId = 10;
        http.open("GET", url + escape(sId), true);
        http.onreadystatechange = handleHttpResponse;
        http.send(null);
    }

    function getHTTPObject() {
        var xmlhttp;

        if (window.XMLHttpRequest){
            xmlhttp = new XMLHttpRequest();
        }
        else if (window.ActiveXObject){
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            if (!xmlhttp){
                xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
            }
        }
        return xmlhttp;
    }

    var http = getHTTPObject(); // We create the HTTP object

......

Now I come to the problem. When I execute GetCustomerdata.php I can get all links from ajax.JQuery. And by clicking on it I need a basic Ajax function since I am loading the same ones <div>

</div>

. But I cannot see it, although I did. Is there something wrong with my code? Or do I need to use any other function?

0


source to share


4 answers


I'm first wondering why you are writing a custom HTTPrequest function when you already have a jquery object, infact you are already using $ .ajax at the top and then create getHTTPObject () later.

The problem is that the javascript requestCustomerInfo () function never delegates the processing of the link in the ajax response data, you need to delegate this function as ajax request callback



$.ajax({
       type:'POST',
       url: 'Links_ajax.php',
       dataType: 'html',
       data:'category='+category,
       success: function(data){
           $("#response").html(data);
           // here add the link click handler
           $("#response a").click(function(){
                // make http get request & custom handler
                $.get('GetCustomerData.php?id=10',function(result){
                    $('#divCustomerInfo').html(result);
                }); return false;
            });
       }
});
-1


source


Try this first:

success: function(data){
     //$("#response").html(data);
     alert(data);
   }

This way you will know if it actually returns data or not.

If this works, you can replace



`$("#response").html(data)`

from

 document.getElementById('response').innerHTML = data;

This should work.

0


source


I highly recommend using FireFox + FireBug to test this or another browser through an HTTP proxy that will log your traffic. FireBug will show you all Ajax requests and responses on your page and help you determine if data is returned and what.

0


source


For starters, don't include script tags. script tags with source should be immediately closed and should be under or and not elsewhere.

-1


source






More articles:


All Articles