H.HISTORY
H.HISTORY

Reputation: 518

AJAX GET function using hyperlink?

I'm trying to use AJAX GET function in my code instead of POST.

i have a few hyperlinks which look like this:

<a class=netro" href="mypage.php?search=dog"></a>
<a class=netro" href="mypage.php?search=cats"></a>
<a class=netro" href="mypage.php?search=donkey"></a>
<a class=netro" href="mypage.php?search=apples"></a>

and in mypage.php I have this:

if (isset($_GET['search'])) {
$search = $_GET['search']; 

////rest of my code////

}

without AJAX, the page page works fine and it gets the results bases on $search properly.

but with AJAX, i get nothing back in response that I get from AJAX.

this is my ajax code:

$(document).ready(function() {
$(function() {
    $('.netro').click(function(event) {
     event.preventDefault();
    var urlssg = "mypage.php"; // the script where you handle the form input.
    $.ajax({
           type: "GET",
           url: urlssg,
           dataType: "html", //expect html to be returned                
           success: function (response) {
                $("#col1").html(response);

                //alert('sent');
            }
         });
    });
});

});

could someone please advise on this issue?

Thanks in advance,

Upvotes: 1

Views: 111

Answers (2)

Mark
Mark

Reputation: 4873

Here is a clean, simple approach:

HTML

<a class="netro" id="dog">Dog</a>
<a class="netro" id="cats">Cat</a>
<a class="netro" id="donkey">Donkey</a>
<a class="netro" id="apples">Apples</a>

JS/JQUERY

$(function() {
    $(".netro").click(function(e) {
    e.preventDefault();
    var sId = $(this).attr("id");
     $.ajax({
           type: "GET",
           url: "mypage.php?search="+sId ,
           data: { search: search_id },
           dataType: "html",              
           success: function (data) {
                //Do something with the response data....
            }
         });
    });
});

Upvotes: 0

Rory McCrossan
Rory McCrossan

Reputation: 337560

You need to provide the search parameter along with the request. Try this:

$(document).ready(function() {
    $('.netro').click(function(event) {
        event.preventDefault();
        var $a = $(this);
        $.ajax({
            type: "GET",
            url: $a.attr('href'), // note that this will include the querystring param
            dataType: "html", //expect html to be returned                
            success: function (response) {
                $("#col1").html(response);
            }
        });
    });
});

Upvotes: 2

Related Questions