Home Forums Plugin Support WP User Frontend (Free Version) jQuery pop up in rich editor

This topic is: not resolved

This topic contains 3 replies, has 2 voices, and was last updated by  Tareq Hasan 5 years, 6 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #13233

    gpspake
    Participant
    Post count: 14

    I have literally been working on this everyday for a week and I can't figure it out.

    I need to add a jQuery tool tip to a rich text box and I'm having a very difficult time getting it to work.

    I have no problem doing this on the regular (teeny) text box but, since the rich editor is in an iframe, I can't get it to fire.

    Here's the code I'm using to show a tooltip when users click in the teeny excerpt editor; I've included the php just in case that's a factor.
    This code works:

    //WPUFE Javascript
    function wpufe_javascript() {
      if ( is_page('submit-announcement') ) {
    		?>		
    	    <script type="text/javascript">
    
    	        (function($) {
    	 
    							$( "label[for=wpuf-post_excerpt]" ).append( '<div class="announcement-excerpt-tooltip" style="display: none;"><p>This is the message that will appear in listserv emails. Make sure to include details if needed. <strong>Do not repeat the title here or it will appear twice!</strong></p></div>')	            
    
    	            $('#post_excerpt').on('focus', function(event) {
    	                $( ".announcement-excerpt-tooltip" ).show("slow");
    	            });
    	            
    	            $('#post_excerpt').on('focusout', function(event) {
    	                $( '.announcement-excerpt-tooltip' ).hide("slow");
    	            });
    
    	        })(jQuery);
    	    </script>
    		<?php
    	}
    }
    add_action( 'wp_footer', 'wpufe_javascript',20 );

    I can even modify the contents of the iframe by replacing the action in the code above with the following:
    $('#post_content_ifr').contents().find('.mceContentBody').html("<p>George</p>");

    But I can't figure out how to add the same kind of click event to the iframe that I have for the teeny editor text area. I've spent hours reading and tried it a hundred different ways but I'm not having much luck.

    Any suggestions?

    #13267

    Tareq Hasan
    Keymaster
    Post count: 2831

    I think you've to handle directly via TinyMCE, may be with an onClick event.

    #13306

    gpspake
    Participant
    Post count: 14

    @tareq,
    I've stumbled across that page and several examples of people using it but I can't seem to get it to work in my code.

    #13357

    Tareq Hasan
    Keymaster
    Post count: 2831

    This works:
    [js]
    var content = tinyMCE.getInstanceById(‘post_content');
    content.onClick.add( function(){
    console.log(‘clicked on me');
    });
    [/js]

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘jQuery pop up in rich editor’ is closed to new replies.