jQuery Forum

1.    <a data-role="button" href="?lang=DE">Change to German</a>

1.     console.log( $('input[type="checkbox"]').length );
                     
       $('input[type="checkbox"]').change( function(e) {
           alert("HELLO");
           });
2.     $(document).on('change', 'input[type="checkbox"]',  function(e) {
           alert("WORLD");
           });

1. fromPage.data("page") is undefined

1. 
        $(document).on( "pagebeforechange", "div:jqmData(role='page')", function( e, data ) {
   
2.             console.log( data );
   
3.             console.log( data.fromPage );
4.             console.log( data.fromPage("page") );
5.             });

1. container = $('<div class="table-menu ui-block-c"><select data-theme="a" name="toggleCols" id="toggleCols" data-native-menu="false" multiple="multiple" data-icon="gear" data-iconpos="notext"><option value="default" data-placeholder="true">Ausblenden</option></select></div>');   

1.  // some loop
2. var toggle = $('<option value="'+id+'">'+someText+'</option>')
3. container.find("#toggleCols").append(toggle);

• I have three separate JQM pages - page1.html, page2.html and page3.html.
• I'm adding my .js files to all pages, so whichever page is loaded first also loads the plugin
• page2.html has a trigger called data-somesome="true" to fire the plugin on page2
• I have added a listener that waits for the trigger page to be created

1. (function($,window){
      $.widget("mobile.somesome",$.mobile.widget, {
         _create: function() { 
             var self = this;
             console.log("here we go");
             ...
             }
      });
      // initialize
      var trigger = $('div:jqmData(somesome="true")').live( 'pagecreate',function(event){ 
      if ($('html').data('somesome-init', 'Off')) {
           $('html').data('somesome-init', 'On')
           console.log("trigger fired");
           trigger.somesome();
           }
       });
   }) (jQuery,this);

However, if I start on either page1.html or page3.html and then call page2.html hoping the plugin would fire, I only get the console "trigger fired", so I'm detecting correct, but the plugin itself doesn't run.

Can anybody give me a hint as to why?

THANKS!

1. data-status="visible"

1. var $correspond = $(this).jqmData("panel"),
2.      $popPanel = $('div:jqmData(panel="'+$correspond+'")');
3. 
   
4. if ( $popPanel.jqmData('status') == 'visible' ) {
   
5.    alert ("visible - hide it");
6.    } else {
7.    alert ("not visible - show it");
8.    $popPanel.jqmData('status','visible');
9.    }

1. $( document ).bind( "pagecreate", function( e ){
       $(e.target).first().multiview();
       });

1. $.mobile.showPageLoadingMsg ()
   

1. $('.submit .ui-btn').live('click', function () {
   
2.   $.mobile.changePage( "#contactCfm", {
3.         transition: "pop",
4.         changeHash: false
5.         }); 
6. });

1. $.mobile.fixedToolbars = (function() {
   
       if ( !$.support.scrollTop || ( $.support.touchOverflow && $.mobile.touchOverflowEnabled ) ) {
           return;
       }
   
       var stickyFooter, delayTimer,
           currentstate = "inline",
           autoHideMode = false,
           showDelay = 100,
           ignoreTargets = "a,input,textarea,select,button,label,.ui-header-fixed,.ui-footer-fixed",
           toolbarSelector = ".ui-header-fixed:first, .ui-footer-fixed:not(.ui-footer-duplicate):last",
        ....

1. var $ap = $('body');

1. $header.prepend('<a class="ui-home popover-btn toggle_popover" data-inline="true" data-panel="menu" data-role="button" href="#" data-theme="a">Filter</a>');

1. $('.popover-btn').trigger('create');
   

1. $('.popover-btn').buttonMarkup();
   

1. (function($ , window, undefined) {
2. $( window.document ).bind('mobileinit', function(){
3.           alert ("init");
   
4.  });     
   
5. })(jQuery,window);
   
   

1. (function( $, window, undefined ){
2.    $.fn.myPlugin = function() {       
   
3.        alert ("init");
4.        };
5.    $( window.document ).bind('mobileinit', function(){ {
6.      myPlugin();
7.      });
8. })( jQuery, window );

1. (function( $, window, undefined ){
2.    $.widget( "myPlugin", $.mobile.widget, {
           options: { },
           _create: function() {$.fn.myPlugin = function() {       
   
3.           alert ("init");          
   
4.            };
5.    $( window.document ).bind('mobileinit', function(){ {
6.      myPlugin();
7.      });
8. })( jQuery, window );

1. <div data-role="collapsible-set">
         <div data-role="collapsible" data-collapsed="false">
         <h3>some header</h3>
         ..... a lot of stuff ....
         </div>
         <div data-role="collapsible" data-collapsed="true">
         <h3>some header</h3>
         ..... more ....
         </div>
         ...
   </div>

1. <a href="#" data-role="button" data-transition="slide" data-direction="reverse" class="ui-home ui-btn-left">Home</a>

1. $('div:jqmData(role="page") div:jqmData(role="header")').each(function(index) {
2.       var findMe = $(this).jqmData(role="button");
         alert (findMe.length);
3.       });   
   

1. var $buttonText = 'DO SOMETHING';
2. $('div:jqmData(role="page")').each(function(index) {
3.       $DoSthButton = '<a href="#" data-role="button" data-inline="true" data-iconpos="left" data-theme="a" class="do_popover ui-btn-left">'+$buttonText+'</a>';
4.       $(this).find('div:jqmData(role="header") h1').prepend($DoSthButton);
5.       $(this).find('.do_popover').buttonMarkup();
6.       });

1. $.mobile.changePage( "about/us.html", { transition: "slideup"} );

1.   var obj = about;
2.  $.mobile.changePage( '$("#'+obj+'"'), { transition: "slideup"} );