jQuery trigger click doesn't work

Question

This is my script :

<script type="text/javascript">
    function is_numeric(n){
        return !isNaN(parseFloat(n)) && isFinite(n);
    }

    jQuery(document).ready(function(){
        // Est-ce que on doit forcer l'ouverture d'un asset en particulier ?
        var Hash = window.location.hash;
        var Triggered = false;

        if(Hash != undefined && Hash != ''){
            Hash = Hash.substring(2);

            if(is_numeric(Hash) === true && Hash > 0){
                Triggered = true;
                jQuery('.show-container[data-id="'+Hash+'"]').trigger('click');
            }
        }

        if(Triggered === false){
            jQuery('.show-container:first-child').trigger('click');
        }

        jQuery('.show-container').bind('click', function(e){
            //  On empêche l'action par défaut du lien
            e.preventDefault();

            if(ContainerEl.css('display') == 'none'){
                ContainerEl.show(0, function(){
                    SubContainerEl.slideDown(300, function(){
                        // Other code there...
                    });
                });
            } else {
                // On cache le tout
                SubContainerEl.slideUp(300, function(){
                    ContainerEl.hide(0);
                });
            }
        });
    });
</script>

and this is the html

<h4 class="heading"><a class="show-container" data-id="1" href="javascript:void(0);">BC600 | <span id="assign_count_1">0</span> / 5</a></h4>
<div id="asset-data-1" data-ajax-loaded="false" class="row-fluid" style="display: none;">
    <div data-container="true" class="span12" style="display: none; height: 310px; overflow: auto;"></div>
</div>

<h4 class="heading"><a class="show-container" data-id="2" href="javascript:void(0);">Ultrabook HP3608 | <span id="assign_count_2">9</span> / 25</a></h4>
<div id="asset-data-2" data-ajax-loaded="false" class="row-fluid" style="display: none;">
    <div data-container="true" class="span12" style="display: none; height: 310px; overflow: auto;"></div>
</div>

The thing is, when window.location.hash is not empty, I want to read it and extract the information. The information will be something like #a2 or #a23... the number is the AssetID.

If I see a valid ID, I want to trigger the click, if not I want to trigger the first one by default.

This doesn't work and the console give me no error. I placed some alert to check if the script was going far enough and yes, he does but the trigger do nothing.

Thanks.

please post the HTML that your PHP generates, not the PHP itself. — jbabey
– jbabey, Commented Aug 15, 2012 at 15:07

Josh Mein · Accepted Answer · 2012-08-15 15:18:37Z

4

You are trying to trigger the click before it has been bound. Your code should be like this:

// This section orignally appeared after the triggering of the click
jQuery('.show-container').bind('click', function(e){
    // Your code
});

if(Triggered === false){
    jQuery('.show-container:first-child').trigger('click');
}

Also as a note, depending on what version of jQuery you are using, bind is deprecated and should be replaced by on().

jQuery('.show-container').on('click', function(e){
    // Your code
});

answered Aug 15, 2012 at 15:18

Josh Mein

28.6k15 gold badges79 silver badges89 bronze badges

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

4 Comments

David Bélanger Over a year ago

It's working, thanks. Couldn't believe I forgot that... Your right I should be using on. In the code you don't see I use it but not there. Thanks for the tip. I switched from an older version to 1.7.2 and I have to stop using bind lol... thnaks !

Josh Mein Over a year ago

Your welcome! Thanks for consolidating your code! It made it a whole lot easier to see the problem.

David Bélanger Over a year ago

Yea I understand. Lot of code make it hard to understand the problem faster then what it is really... but I sometime forget that the people who will read it aren't... me so it's a different point of view... Thanks for helping sir!

David Bélanger Over a year ago

I should be using jQuery('.show-container:eq(0)').trigger('click'); instead of jQuery('.show-container:first-child').trigger('click'); also in this case.

Catalin MUNTEANU · Accepted Answer · 2012-08-15 15:17:34Z

0

The problem is that your Hash is a String; is_numeric() will return true even if you pass it a String like '20' or '55'.

You need to convert the string to number.

A way to do this is:

var Hash = 'a23';
Hash = Hash.substring(2);

var actualNumber = Number(Hash); // Here you convert the string to number

This should work.

answered Aug 15, 2012 at 15:17

Catalin MUNTEANU

5,6442 gold badges37 silver badges43 bronze badges

3 Comments

Catalin MUNTEANU Over a year ago

I found another issue in your code. If your hash is something like: 'a23', 'a2', 'a1000', using substring(2) will only get all the characters after first 2 like this: '3', 'empty string', '000' (for my examples); You should use substring(1, Hash.length);

David Bélanger Over a year ago

No. Because window.location.hash also return the hash tag at first.

Catalin MUNTEANU Over a year ago

You could use console.log(Hash > 0); exactly before 'if(is_numeric(Hash) === true && Hash > 0)'. It will return false if Hash is not a number and this way you can see that this check is valid and something else is causing the problem.

Collectives™ on Stack Overflow

jQuery trigger click doesn't work

2 Answers 2

4 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related