Okay, so im trying to get the attribute of a clicked Li tag, and annoyingly, it keeps posting: [object Object] and I can't work out why.
Code:
[syntax=javascript]
$(document).ready(function(){
$("li").click(function(){
var catChosen = $("li").attr('name');
$('.step_2 #sub-category').attr('holder',catChosen);
var c1 = $('.step_2 #sub-category').attr('holder',catChosen);
$('.step_1').hide();
$('.step_2').show();
alert('Category: ' + c1);
});
});
[/syntax]
HTML structure (of relavent bit)
[syntax=xhtml]
<section id="left" class="step_1">
<h2>Categories</h2>
<ul id="categories">
<a href="#"><li name="c1">Tutorials</li></a>
<a href="#"><li name="c2">Blog</li></a>
<a href="#"><li name="c3">Unboxing</li></a>
<a href="#"><li name="c4">Showing Off</li></a>
<a href="#"><li name="c5">Music</li></a>
</ul>
</section>
<section id="left" class="step_2">
<h2>Tutorials</h2>
<ul id="sub-categories">
<a href="#"><li name="s1">Web</li></a>
<a href="#"><li name="s1">Web</li></a>
<a href="#"><li name="s1">Web</li></a>
</ul>
</section>
[/syntax]
jQuery [object Object] issue
-
- Posts: 534
- Joined: Thu May 05, 2011 8:19 pm
jQuery [object Object] issue
I don't like to brag, but I wasn't circumcised. I was circumnavigated.
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9
Re: jQuery [object Object] issue
In your JavaScript (or jQuery) every notion of #sub-category should be changed to #sub-categories. Hopefully that will fix your issue.
Using the wrong selector can cause a great deal of trouble
Using the wrong selector can cause a great deal of trouble
Please check out my CodeCanyon items.
-
- Posts: 534
- Joined: Thu May 05, 2011 8:19 pm
Re: jQuery [object Object] issue
Heh. My bad
I don't like to brag, but I wasn't circumcised. I was circumnavigated.
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9
-
- Posts: 534
- Joined: Thu May 05, 2011 8:19 pm
Re: jQuery [object Object] issue
another issue now
Not really related, but didnt think it warranted making a new topic since its probably a stupid mistake again
[syntax=javascript]$('#submit').submit(function(){
var $inputs = $('#filtering :input');
var filterData = {};
$inputs.each(function() {
filterData[this.name] = $(this).val();
});
var request = $.ajax({
type: "POST",
url: "filters.php",
data: filterData,
dataType: 'text',
success: function(){
$('#filters').fadeOut(250);
$('#results').fadeIn(250);
}
});
request.done(function(msg){
alert(msg);
});
request.fail(function(){
alert('fail');
});
});[/syntax]
[syntax=xhtml] <section id="right">
<div id="filters" class="scrollable">
<h2>Filters</h2>
<form method="post" id="filtering">
<input name="search" id="search" type="text" placeholder="Search Query..."/>
<div class="group">
<!-- uses sprites for efficiency, but *could* use individual <img>'s iff absolutely necessary -->
<div class="filter" name="Gender">
<div class="image" name="Either" style="background-position: 0px 0px"></div>
<div class="image" name="Male" style="background-position: 0px -70px"></div>
<div class="image" name="Female" style="background-position: 0px -140px"></div>
<div class="image" name="Neither" style="background-position: -70px 0px"></div>
<input type="text" class="input" id="gender_val" name="gender" value="" disabled="true" />
</div>
<div class="filter" name="Location">
<div class="image" name="Huh?" style="background-position: -70px -70px"></div>
<div class="image" name="Happy" style="background-position: -70px -140px"></div>
<div class="image" name="What!?" style="background-position: -140px 0px"></div>
<input type="text" class="input" id="location_val" name="location" value="" disabled="true" />
</div>
</div>
<input id="submit" type="button" value="Go →" />
</form>
</div>
<div id="results">
<div class="scrollable group">
<a href="play_video.html" title="Result 1" style="background: url('data/grass.jpg')"></a>
<a href="play_video.html" title="Result 2 which is a really cool result></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
</div>
<input id="back" class="fl-left" type="button" value="←" />
<div class="pagination fl-right">
<a href="#" class="disabled">« previous</a>
<a href="#" class="current">1</a>
<a href="#">2</a>
<a href="#">3</a>
<span class="ellip">…</span>
<a href="#">17</a>
<a href="#" >next »</a>
</div>
</div>
</section>[/syntax]
When i press the go button, nothing happens. Any ideas why? :/
Not really related, but didnt think it warranted making a new topic since its probably a stupid mistake again
[syntax=javascript]$('#submit').submit(function(){
var $inputs = $('#filtering :input');
var filterData = {};
$inputs.each(function() {
filterData[this.name] = $(this).val();
});
var request = $.ajax({
type: "POST",
url: "filters.php",
data: filterData,
dataType: 'text',
success: function(){
$('#filters').fadeOut(250);
$('#results').fadeIn(250);
}
});
request.done(function(msg){
alert(msg);
});
request.fail(function(){
alert('fail');
});
});[/syntax]
[syntax=xhtml] <section id="right">
<div id="filters" class="scrollable">
<h2>Filters</h2>
<form method="post" id="filtering">
<input name="search" id="search" type="text" placeholder="Search Query..."/>
<div class="group">
<!-- uses sprites for efficiency, but *could* use individual <img>'s iff absolutely necessary -->
<div class="filter" name="Gender">
<div class="image" name="Either" style="background-position: 0px 0px"></div>
<div class="image" name="Male" style="background-position: 0px -70px"></div>
<div class="image" name="Female" style="background-position: 0px -140px"></div>
<div class="image" name="Neither" style="background-position: -70px 0px"></div>
<input type="text" class="input" id="gender_val" name="gender" value="" disabled="true" />
</div>
<div class="filter" name="Location">
<div class="image" name="Huh?" style="background-position: -70px -70px"></div>
<div class="image" name="Happy" style="background-position: -70px -140px"></div>
<div class="image" name="What!?" style="background-position: -140px 0px"></div>
<input type="text" class="input" id="location_val" name="location" value="" disabled="true" />
</div>
</div>
<input id="submit" type="button" value="Go →" />
</form>
</div>
<div id="results">
<div class="scrollable group">
<a href="play_video.html" title="Result 1" style="background: url('data/grass.jpg')"></a>
<a href="play_video.html" title="Result 2 which is a really cool result></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
<a href="play_video.html" title="Result 1"></a>
<a href="play_video.html" title="Result 2 which is a really cool result"></a>
<a href="play_video.html" title="Result 3"></a>
<a href="play_video.html" title="Result 4"></a>
<a href="play_video.html" title="Result 5"></a>
</div>
<input id="back" class="fl-left" type="button" value="←" />
<div class="pagination fl-right">
<a href="#" class="disabled">« previous</a>
<a href="#" class="current">1</a>
<a href="#">2</a>
<a href="#">3</a>
<span class="ellip">…</span>
<a href="#">17</a>
<a href="#" >next »</a>
</div>
</div>
</section>[/syntax]
When i press the go button, nothing happens. Any ideas why? :/
I don't like to brag, but I wasn't circumcised. I was circumnavigated.
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9
Re: jQuery [object Object] issue
What do you mean nothing happens? Nothing happens as in, you don't even get one of those alert boxes that you should be getting?
Please check out my CodeCanyon items.
-
- Posts: 534
- Joined: Thu May 05, 2011 8:19 pm
Re: jQuery [object Object] issue
yes, Nothing. No alert. Nothing :/
I don't like to brag, but I wasn't circumcised. I was circumnavigated.
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9
Re: jQuery [object Object] issue
Ah.
That so-called submit button is actually just a normal button, i.e. doesn't submit. So you either have to use the click method on that button, or change the button to a submit button.
That so-called submit button is actually just a normal button, i.e. doesn't submit. So you either have to use the click method on that button, or change the button to a submit button.
Please check out my CodeCanyon items.
-
- Posts: 534
- Joined: Thu May 05, 2011 8:19 pm
Re: jQuery [object Object] issue
I changed it to a submit and it just refreshed the page (with the # thing in the URL)..
So, im just going with PHP and normal form submission.. Much easier
So, im just going with PHP and normal form submission.. Much easier
I don't like to brag, but I wasn't circumcised. I was circumnavigated.
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9
Want to learn something new? Or maybe reinforce what you already know? Or just help out? Please subscribe to my videos: http://goo.gl/58pN9