Alex
Alex

Reputation: 4934

Problem using jQuery $.ajax()

I'm having problems using ajax with jQuery...

I have the following jscript:

$(document).ready(function() {

    $('rel[close]').click(function() {
        $(this.parent).close();
    });

    $('a[rel=track]').click(function() {
        var track = this.attr('href');
        track = track.replace(/^.*#/, ''); // remove the hash part of tag id
        var data = 'track=' + track + '&user=<? echo $user; ?>',
        $.ajax({
            url: 'purchase.php',
            type: 'GET',
            data: data,
            cache: false,
            success: function (html) {
                $('#purchasePanel').html(html);
                $('#purchasePanel').show();
                }
            }
        )
    });
});

The debugger says theirs a problem with line $.ajax({ Unexpected token .

This is the CSS:

#purchasePanel { position:absolute; width:200px; height:115px; z-index:1; visibility:hidden; }

With this HTML:

<div id="purchasePanel"> <a href="Close" rel="close">Close this window</a> </div>

The script fails to run and no hidden DIV pops up or anything.

Any ideas why??

Many thanks, Alex

Upvotes: 0

Views: 172

Answers (4)

themerlinproject
themerlinproject

Reputation: 3582

Try this:

$(document).ready(function() {

    $('rel[close]').click(function() {
        $(this.parent).close();
    });

    $('a[rel=track]').click(function() {
        var track = this.attr('href');
        track = track.replace(/^.*#/, ''); // remove the hash part of tag id
        var data = 'track=' + track + '&user=<? echo $user; ?>';
        $.ajax({
            url: 'purchase.php',
            type: 'GET',
            data: data,
            cache: false,
            success: function (html) {
                $('#purchasePanel').html(html);
                $('#purchasePanel').show();
                }
        });
    });
});

Upvotes: 0

Richard Dalton
Richard Dalton

Reputation: 35803

It's probably the comma here instead of a semi-colon:

$('a[rel=track]').click(function() {
    var track = this.attr('href');
    track = track.replace(/^.*#/, ''); // remove the hash part of tag id
    var data = 'track=' + track + '&user=<? echo $user; ?>', <--------------
    $.ajax({
        url: 'purchase.php',
        type: 'GET',
        data: data,
        cache: false,
        success: function (html) {
            $('#purchasePanel').html(html);
            $('#purchasePanel').show();
            }
        }
    )
});

Upvotes: 1

ThiefMaster
ThiefMaster

Reputation: 318808

You had some incorrectly placed braces. (they were just placed in a very confusing way and not properly indented)

Right before the $.ajax call you have a , instead of a ;.

You also need to use $(this).attr('href'); as this is a plain DOM object and .attr() need a jQuery object.

Here's the code that should be working:

$(document).ready(function() {

    $('rel[close]').click(function() {
        $(this.parent).close();
    });

    $('a[rel=track]').click(function() {
        var track = $(this).attr('href');
        track = track.replace(/^.*#/, ''); // remove the hash part of tag id
        var data = 'track=' + track + '&user=<? echo $user; ?>';
        $.ajax({
            url: 'purchase.php',
            type: 'GET',
            data: data,
            cache: false,
            success: function (html) {
                $('#purchasepanel').html(html);
                $('#purchasepanel').show();
            }
        });
    });
});

Upvotes: 3

Joe Enos
Joe Enos

Reputation: 40431

I don't know if this is causing the problem, but you don't have a semi-colon at the end of your ajax function call.

Upvotes: 0

Related Questions