Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

trigger click event of div manually

Tags:

jquery

events

i have a div which has many divs.when binding the divs i create click event for each item like below

    jQuery.each(opts.items, function (i, item)
                    {
                        var image = opts.image;
                        jQuery('jQuery('<div class="' + opts.optionClassName + opts.controlId + '" id="' + item.key + '" ><img src="' + image + '" alt="checkbox" />' + item.value + '</div>')
                                .click(function ()
                                {')
                                        .click(function ()
                                        {

    //code goes here

    }

when the div is clicked in UI this gets triggered, but when i try to do it manually it does not get triggered. any help on how to trigger would be great. i hardcoded the div values and tried to call but it is of no use.

   var id1 = 'Car';
    var id2 = 'Bus';
    $('div class="CList" id="1" >' + id1 + '</div>').trigger('click');
    $('div class="CList" id="3" >' + id2 + '</div>').trigger('click');

even this

    var id1 = 'Car';
    var id2 = 'Bus';
    $('div class="CList" id="1" >' + id1 + '</div>')[0].click();
    $('div class="CList" id="3" >' + id2 + '</div>')[0].click();
like image 608
G-- Avatar asked Nov 05 '13 09:11

G--


3 Answers

What you have aren't valid selectors. You're passing something that's almost HTML to the jQuery function so it doesn't know what to do with it.

If the IDs for your elements are 1 and 3, then you'd just do:

$('#1, #3').trigger('click');

Perhaps a better way, if you want to simulate the click on each of them, is to iterate over your collection again:

jQuery.each(opts.items, function(i, item) {
    $('#' + item.key).trigger('click');
});
like image 100
Anthony Grist Avatar answered Oct 31 '22 16:10

Anthony Grist


Get you Elements via Jquery and use trigger function ;)

$("#yourdesiredselementsid").trigger("click");
like image 35
Igle Avatar answered Oct 31 '22 14:10

Igle


Give your outer div a class name

  <div class="display">
   <div id="1"></div>
   <div id="2"></div>
    </div>

And then

$('.display').on('click','div',function (e) {

alert('hey');
  });
like image 40
abidmix Avatar answered Oct 31 '22 15:10

abidmix