WordPress.org

Ready to get started?Download WordPress

Forums

Collapse-O-Matic
[resolved] Binding of click events with on to work with ajax (5 posts)

  1. biswajeet
    Member
    Posted 1 year ago #

    Hi, It would be nice if all the clicks and hover events are bind with on() so that when contents having Collapse-O-Matic shortcode are retrieved/executed via ajax, everything should functioning normally as expected.

    example -
    jQuery(document).on( 'click', '.collapseomatic', function() {...});

    Additionally, there should provide a js config option to show on / off titles when mouse over is done on Collapse-O-Matic elements which is desirable in some cases.

    Hence, these kind of enhancement features should include in the upcoming release...

    Thanks!

    http://wordpress.org/extend/plugins/jquery-collapse-o-matic/

  2. Baden
    Member
    Plugin Author

    Posted 1 year ago #

    Have you read the documentation? The Alt Attribute deals specifically with the mouse over titles. As for loading content via AJAX, currently the 'click' is being triggered by:

    jQuery('.collapseomatic').click(function() {
    ...
    });

    We could bind this using livequery:

    jQuery('.collapseomatic').livequery('click', function() {
    ...
    });

    But we will look into the .on() Event Handler Attachment

  3. Baden
    Member
    Plugin Author

    Posted 1 year ago #

    biswajeet,

    Please download and install version collpase-o-matic v1.4.8a This version supports the .on() event handler. However, keep in mind that after the new content successfully loads in via AJAX, you will need to manually set up the initial collapse state on any newly included collapse elements:

    //inital collapse

    jQuery('.collapseomatic:not(.colomat-close)').each(function(index) {
    	    var thisid = jQuery(this).attr('id');
    	    jQuery('#target-'+thisid).css('display', 'none');
    });

    //inital swaptitle for pre-expanded elements

    jQuery('.collapseomatic.colomat-close').each(function(index) {
    	    var thisid = jQuery(this).attr('id');
    	    if(jQuery("#swap-"+thisid).length > 0){
    			swapTitle(this, thisid);
    		}
    });

    //initial position for find-me feature

    jQuery('.find-me').each(function(index) {
    		var thisid = jQuery(this).attr('id');
    		if( !jQuery('#find-'+thisid).attr('name') ){
    			var target_offset = jQuery(this).offset();
    			var target_top_offset = target_offset.top;
    			jQuery('#find-'+thisid).attr('name', target_top_offset);
    		}
    });

    Let us know if you get it to work, and any changes that would make it easier to work with collapse elements that are inserted via AJAX. Best of luck!

  4. biswajeet
    Member
    Posted 1 year ago #

    Hi, I have actually using this for my ajax FAQs from a long time. Previously I used live() but later when wp is updated to jquery 1.7+, on() is the best one to bind with...

    Also if we don't want the title tool-tip then according to documentation we can use alt=" ". But I think we can use a special tag like notitle="1" with the shortcode to not include the title attribute.

    This can be easily done like -

    extract(shortcode_atts(array(
    		'title' => '', ... , 'notitle' => 0
    	), $atts));
    
     if( (int)$notitle ) { $altatt = ''; }

    This way everything are working fine. But I want to bring this to your notice as this plugin get constantly new releases, I have to go each time and manually modify these codes. So, if you think its useful you can implement it in the new release.

    thanks.

  5. Baden
    Member
    Plugin Author

    Posted 1 year ago #

    Please download and upgrade to v1.4.8.b located at: http://plugins.twinpictures.de/plugins/collapse-o-matic/

    The attribute notitle has been added. Simply set notitle="true" or notitle="1" and BAM, no title.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic