PDA

View Full Version : How to fire click event of an LI tag?



round
01-11-2013, 06:09 AM
Hello Dear,

xhtmljunkies.com this is my site & please open:

xhtmljunkies.com/logo-designing.html

page. Click on View Our Portfolio button.
Now you will see portfolio page right?

So now my question is if you directly open portfolio page then there is no problem because user will click the buttons and get the respective result but if I come through another page then I am able to it's respected results but when I click on other tabs then their respective results are coming but very weired. I did the thing like below.

I put the script at the end of portfolio page so when it finishes loading then it is executed....Currently I put this in local




if(page=portfolio) // this is I am getting through php so not to worry for this line
{
INSTEAD OF li I PUT .cat-item-8 TO TEST LOGO DESIGN DIRECTLY FOR EXAMPLE..........GOT THAT?

var s = jQuery.noConflict();

// Clone applications to get a second collection
var $data123 = s(".portfolio-area").clone();

s(".filter li").removeClass("active");
// Use the last category class as the category to filter by. This means that multiple categories are not supported (yet)
//var filterClass=$(this).attr('class').split(' ').slice(-1)[0];

var filterClass123 = "cat-item-8";

if (filterClass123 == 'all') {
var $filteredData123 = $data123.find('.portfolio-item2');
} else {
var $filteredData123 = $data123.find('.portfolio-item2[data-type=' + filterClass123 + ']');
}

//alert($filteredData);

s(".portfolio-area").quicksand($filteredData123, {
duration: 600,
adjustHeight: 'auto'
}, function () {

lightboxPhoto();
});
s(this).addClass("active");
}


It's respective things are coming but now when we click on another tab then those's respective things are coming but looking very weired. The above code I am trying in local but if problem would be solved then I can live. If someone comes to this question & if ask to do these changes in live then I can do it in live for quick watching result :) so you can get the idea quickly

Can you help?

Thanks
Kaushal

jscheuer1
01-12-2013, 05:03 AM
In jQuery like you're using on that page:


jQuery(DOM_or_CSS_reference_to_the_LI_tag).trigger('click');

There are other ways. See also:

http://api.jquery.com/?s=trigger

However, I think you might have other problems. I was playing around with the portfolio page, clicking XTML and then ALL PROJECTS and then back again and again and again and the browser crashed.

round
01-12-2013, 05:07 AM
Dear jscheuer1,

Should I live the thing now to see that directly in live?
So that will be easy for you to gudge the problem.

I am quite close to the solution.

Thanks
Kaushal

round
01-12-2013, 05:18 AM
Hello jscheuer1,

I have made things the live. please see:

xhtmljunkies.com/logo-designing.html

& click on View Portfolio Button then you will be redirected to

xhtmljunkies.com/portfolio.html

You will see the Logo Design's things but logo design is not selected & Now if you click on other tabs you will see that the respective results are coming but weired.

The thing is if you directly open portfolio page then all the things will be fine but if you go from xhtmljunkies.com/logo-designing.html then other tabs are not working.

Can you please help?

Thanks
Kaushal

round
01-12-2013, 12:51 PM
Hello Dear,

Because the site is live I am removing the above stated changes. Now I will again do changes on Wednesday. I make the changes in live to let you understand the problem very quickly :)

So will meet on Wednesday. :)

Thanks
Kaushal

jscheuer1
01-12-2013, 11:13 PM
Please don't hotlink to your pages. I've fixed the ones in the above posts. In the future, instead of typing like:

http://www.xhtmljunkies.com/portfolio.html

Instead type it like so:

xhtmljunkies.com/portfolio.html

We can still paste it into our browser's address bar and get there, but it won't cause a problem with search engines.

Also, if I happen to be around on Wednesday I can check out the problem. It would be better if you could make up live copies of the pages that are, as I say live, but not a part of the main site. That way I, or anyone, could look at the problem at any time.

round
01-16-2013, 05:27 AM
Dear jscheuer1,

I have made the things live.

xhtmljunkies.com/logo-designing.html

& click on View Portfolio Button then you will be redirected to

xhtmljunkies.com/portfolio.html

You will see the Logo Design's things but logo design is not selected & Now if you click on other tabs you will see that the respective results are coming but weired.

The thing is if you directly open portfolio page then all the things will be fine but if you go from xhtmljunkies.com/logo-designing.html then other tabs are not working.

Can you please help?

Thanks
Kaushal

jscheuer1
01-16-2013, 05:59 AM
jQuery('li.cat-item-8').trigger('click');

round
01-16-2013, 06:20 AM
Dear Jscheuer1,

Thank you for your kind reply. But if I put that statement then only Logo Design tab remains selected but not the relevant result.
Though Logo Design Tab is selected, please click on it. Now you will see it's relevant result.

Now can you suggest what's the problem? :)

Thanks
Kaushal

jscheuer1
01-16-2013, 06:46 AM
Well, if I just run it:


jQuery('li.cat-item-8').trigger('click');

in the console, it highlights the Logo Design tab and carries out the action.

I would suggest getting rid of everything you have in your first post in this thread. Then, get the POST data value of 'page' via PHP. If it's 'logo-designing' run that snippet on page load. Something like:


<?php
if($_POST['page'] == 'logo-designing'){ ?>
<script type="text/javascript">
jQuery(window).load(function(){
jQuery('li.cat-item-8').trigger('click');
});
</script>
<?php } ?>

To work right, you may have to put it at the end of the page.

round
01-16-2013, 07:00 AM
Dear Jscheuer1,

Thank you for your reply Jscheuer1. :)
I did the things same as you have written and yes also put that script at the end of page.

But still it is not working. At the time of starting this thread (means starting from the first post) I put the following thing (that is commented now & applied your suggestion that is jQuery('li.cat-item-8').trigger('click'); ) :- :)



<?php
if($_POST['page']!='') // this means logo design. I am getting no problem with that
{
?>
<script>
/*function lightboxPhoto123() {
jQuery("a[rel^='prettyPhoto']").prettyPhoto({
animationSpeed:'fast',
slideshow:5000,
theme:'facebook',
show_title:false,
overlay_gallery: true
});

}*/
jQuery('li.cat-item-8').trigger('click');
</script>
<script type="text/javascript">
/*var s = jQuery.noConflict();

// Clone applications to get a second collection
var $data123 = s(".portfolio-area").clone();

s(".filter li").removeClass("active");
// Use the last category class as the category to filter by. This means that multiple categories are not supported (yet)
//var filterClass=$(this).attr('class').split(' ').slice(-1)[0];

var filterClass123 = "cat-item-8";

if (filterClass123 == 'all') {
var $filteredData123 = $data123.find('.portfolio-item2');
} else {
var $filteredData123 = $data123.find('.portfolio-item2[data-type=' + filterClass123 + ']');
}

//alert($filteredData);

s(".portfolio-area").quicksand($filteredData123, {
duration: 600,
adjustHeight: 'auto'
}, function () {lightboxPhoto123();});
s(this).addClass("active");
*/
</script>
<?php
}
?>



You can see script.js for why I put that code which is commented now.
I think that will help.

Thanks
Kaushal

jscheuer1
01-16-2013, 12:58 PM
This:


jQuery('li.cat-item-8').trigger('click');

should be:


jQuery(window).load(function(){
jQuery('li.cat-item-8').trigger('click');
});

round
01-16-2013, 01:59 PM
My God..........Jscheuer1 you are simply the superb, man.

Thank you...........Thank you very very much :)

It is working fine now. :)

Thanks
Kaushal