retrieving variables with jquery ajax

Question

 <div class="lead_detail_box_routing">


<div class="lead_detail_box_left">location 1</div>
<div class="lead_detail_box_right">Route</div>
<div class="lead_detail_box_left">location 2</div>
<div class="lead_detail_box_right">Route</div>
<div class="lead_detail_box_left">location 3</div>
<div class="lead_detail_box_right">Route</div>
<div class="lead_detail_box_left">location 4</div>
<div class="lead_detail_box_right">Route</div>

<div id="results" style="text-align:center;"></div>  

</div>     <!-- end lead_detail and routing-->

e.g. when user clicks on "route" I want my jquery-manual-routing.php to get the "3" ..

so far I have:

   <script type="text/javascript">
    $(document).ready(function() {
        $("a#route").click(function() {
            $("#results").load( "jquery-manual-routing.php", { route_to: ???? } );
            return false;
        });
    });    
    </script>

so in my php script, when the user clicks on route next to location 3 I want to be able to grab $_GET['route_to'] =3;

Also note that my table already has the class assigned since I am using css to style it

The answer will be pure php echo

Show your HTML. Also, what are you going to do with the server response, and what content type will the response be (XML, JSON, HTML, etc.)? — Matthew Flaschen
– Matthew Flaschen, Commented Apr 26, 2010 at 19:45

Matt Smith · Accepted Answer · 2010-04-26 19:55:08Z

1

fill in the url of the anchor tags with the actual link you need then override the default click action with your jquery function

<a class="route" href="jquery-manual-routing.php?route_to=1">route to destination 1</a><br/>
<a class="route" href="jquery-manual-routing.php?route_to=2">route to destination 2</a><br/>
<a class="route" href="jquery-manual-routing.php?route_to=3">route to destination 3</a><br/>
<a class="route" href="jquery-manual-routing.php?route_to=4">route to destination 4</a> etc...

<script type="text/javascript">
    $("a.route").live('click', function() { // live is better
        $("#results").load( $(this).attr('href') );
        return false;
    });
</script>

answered Apr 26, 2010 at 19:55

Matt Smith

1,2311 gold badge8 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

vick Over a year ago

im getting: Error: missing ) after argument list Source File: lead_detail.php?lead_id=68443 Line: 139, Column: 49 Source Code: $("#results").load( $(this).attr('href') } );

vick Over a year ago

that worked wonderful thanks everyone! It would be nice to have a "wait while loading" div show up when the ajax is called, anyone?

Amy B · Accepted Answer · 2010-04-26 19:54:21Z

0

$(document).ready(function() {
    $("a#route").click(function(event) {
        link = $(event.target);

        $("#results").load( "jquery-manual-routing.php", { route_to: link.text() } );

        return false;
    });
});

That would call jquery-manual-routing.php?route_to=location 3

answered Apr 26, 2010 at 19:54

Amy B

18k12 gold badges66 silver badges83 bronze badges

Comments

Kumu · Accepted Answer · 2010-04-26 20:03:54Z

0

If going by the HTML you provided this is a possible solution:

<script type="text/javascript">
    $(document).ready(function() {
        $("div.lead_detail_box_right").click(function() {
            $("#results").load( "jquery-manual-routing.php", { route_to: $(this).prev().text().replace("location ", "") } );
        });
    });    
</script>

Grab the previous element and get the number in the text. I used replace, you can also use split

answered Apr 26, 2010 at 20:03

Kumu

2,4262 gold badges14 silver badges9 bronze badges

Comments

Tgr · Accepted Answer · 2010-04-26 20:18:05Z

0

Getting the number from the text: (this is the clicked div)

$(this).text().replace(/.*?(\d+)$/, '$1')

Getting it from the position of the div:

$('.lead_detail_box_left').index(this) + 1

answered Apr 26, 2010 at 20:18

Tgr

28.4k13 gold badges88 silver badges123 bronze badges

Collectives™ on Stack Overflow

retrieving variables with jquery ajax

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related