Die 20
Die 20

Reputation: 261

undefined jquery variable in multiple independent divs

I have this script that grabs the value from an input field then inserts it into the attribute (href) of a link. For some reason, the value is listed as undefined.

Here is the jQuery

$(".page_link").click(function() {
                 var page_id = $(this).find(".page_id_value").val();
                 $(location).attr('href',"page_detail.php?page="+page_id);

            });

Here is the HTML

<a class="page_link" onClick="window.location.href='page_detail.php?page=164';">
     <!--<input type="hidden" class="page_id_value" value="145" />-->
</a>

<a class="page_link" onClick="window.location.href='page_detail.php?page=165';">
     <!--<input type="hidden" class="page_id_value" value="146" />-->
</a>

<a class="page_link" onClick="window.location.href='page_detail.php?page=166';">
     <!--<input type="hidden" class="page_id_value" value="147" />-->
</a>

EDIT:The best way to accomplish my goal is to use window.location.href instead of using jquery to change the page. I was using the input field the grab the value for the page variable in the header. The better approach is to just use the window.location.href. Thanks for the help! The above HTML is corrected and the jQuery is the incorrect approach. This webpage is running in jQuery Mobile.

Upvotes: 0

Views: 120

Answers (1)

Daedalus
Daedalus

Reputation: 7722

The problem with your current code is that .attr() is used to get the attribute from html elements.. it does not get or change properties from javascript objects, which is what location is.. a javascript object. What you want to use it instead, to change that property, is .prop().

Fixed example

Upvotes: 1

Related Questions