ansaurus

Question

Correct syntax to get my Ajax function to work

Answer 1

A:

Here is a starter for ten - I've corrected some additional braces and added error handling. If you still get an error, at least you@ll be able to tell us what it is.

$.ajax({
    url: 'php/dpdetails.php?q='+urlplan,
    success: function (data) {
        $('#Pinfo').html(data);
    },
    error: function (xhr, ajaxOptions, thrownError) {
        alert(xhr.status);
        alert(thrownError);
    }
});

Sohnee 2010-08-02 11:01:37

I have added you code, but it is not throwing an error.A bit more info , If I change the ".dist a" to just an "a" the Ajax works if I click on any element with an anchor on the page.I does not seem to recognise the ".dist a" generated by the PHP

Scott 2010-08-02 11:50:05

$(".dist a").css("color", "Aqua"); ... Try this code and see if it changes the colour of the links that should be ajax-ed! If not, can you post the HTML after it has been rendered by PHP?

Sohnee 2010-08-03 10:29:22

Answer 2

A:

I'd add a console.log(urlplan) right after the click event handler. make sure that returned value works if you manually enter

php/dpdetails.php?q=test&anotherVar=5

into the address bar.

What does console.log(urlplan) return?

Bob Gregor 2010-08-03 16:13:53

Answer 3

A:

Here is a sample piece of code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>What</title>
</head>
<body>
<?php
$anchorList = "";
$rows = array(
    array(
        'NAME' => 'me1'
    , 'PLAN' => 'thePlan1'
    )
, array(
        'NAME' => 'me2'
    , 'PLAN' => 'thePlan2'
    )
);

$anchorList .= "<div class=\"dist\">";
$anchorList .= "<ul>";

foreach ($rows as $row) {
    $anchorList .= "<li>";
    $anchorList .= createAnchorTag($row['NAME'], $row['PLAN']);
    $anchorList .= "</li>";
}

$anchorList .= "</ul>";
$anchorList .= "</div>";

echo $anchorList;

function createAnchorTag($name, $plan) {
    return "<a href=\"devplan.php?search-n=" . $name . "&" . rawurlencode($plan) . "\"" . ">" . $plan . "</a>";
}

?>

</body>

</html>
<script type="text/javascript" src="../scripts/jquery-1.4.2.modified.js"></script>

<script type="text/javascript">
    // Code to fill center panels with data
    urlquery = location.search;
    urlparts = urlquery.split('&');
    urlplan = urlparts[1];

    $(document).ready(function() {
        $('.dist a').click(function() {
            $.ajax({
                url: 'php/dpdetails.php?q=' + urlplan,
                success: function (data) {
                    $('#Pinfo').html(data);
                }
            });

            return false;
        });
    });
</script>

In your click function you need to return false in order to override the anchor tags wanting to redirect.

[EDIT]

I believe your actually looking to parse the href attribute of the anchor tag and pass it to the Ajax, right? If so use this script:

<script type="text/javascript">
    $(document).ready(function() {
        $('.dist a').click(function() {
            var urlquery = $(this).attr('href').val();
            // regex would be better than split, could create a more generic function
            var urlparts = urlquery.split('&');
            var urlplan = urlparts[1];

            $.ajax({
                url: 'php/dpdetails.php?q=' + urlplan,
                success: function (data) {
                    $('#Pinfo').html(data);
                }
            });

            return false;
        });
    });
</script>

Gutzofter 2010-08-07 04:20:42

ansaurus

tags:

views:

answers:

Correct syntax to get my Ajax function to work

related questions