added override to prevent JQM table popup creation

js/erp5_loader.js

@@ -2634,6 +2634,7 @@
       "portal_type_title": "invoices",
       "layout": {
         "jqm_table_properties": {
+          "nopop": true,
           "enhanced": false,
           "toggle": false,
           "view": "columntoggle",
@@ -4402,6 +4403,9 @@
         if (settings.configuration.sorting) {
           config["data-sort"] = "true";
         }
+        if (settings.layout.jqm_table_properties.nopop) {
+          config["data-use-pop"] = false;
+        }
 
         table = priv.generateElement("table", {"id":portal_type + "_1", "className":"table-stroke ui-responsive"}, config,{});
         table.appendChild(table_header);

js/extensions.js

@@ -449,6 +449,7 @@ $.widget( "mobile.table", {
 
 $.widget( "mobile.table", $.mobile.table, {
   options: {
+    usePop: true,
     mode: "columntoggle",
     columnBtnShow: true,
     columnBtnTheme: null,
@@ -469,32 +470,48 @@ $.widget( "mobile.table", $.mobile.table, {
   },
 
   _create: function() {
+    var o = this.options;
+
     this._super();
 
-    if( this.options.mode !== "columntoggle" ) {
+    if( o.mode !== "columntoggle" ) {
       return;
     }
-
     $.extend( this, {
-      _menu: null
+      _menu: null,
+      _menuButton: null
     });
 
-    if( this.options.enhanced ) {
-      this._menu = this.document.find( this._id() + "-popup" ).children().first();
-    } else {
-      this._menu = this._enhanceColToggle();
-      this.element.addClass( this.options.classes.columnToggleTable );
-    }
+    if( o.usePop) {
+      if( o.enhanced ) {
+        this._menu = this.document.find( this._id() + "-popup" ).children().first();
+      } else {
+        this._menu = this._enhanceColToggle();
+        this._setTableClasses();
+      }
 
-    this._setupEvents();
+      this._setupEvents();
 
-    this._setToggleState();
+      this._setToggleState();
+    } else {
+      this._setTableClasses();
+    }
+    if (o.sort) {
+      this._setSorting();
+    }
+    if (o.wrap) {
+      this._wrapTable();
+    }
   },
 
   _id: function() {
     return ( this.element.attr( "id" ) || ( this.widgetName + this.uuid ) );
   },
 
+  _setTableClasses: function () {
+    this.element.addClass( this.options.classes.columnToggleTable );
+  },
+
   _setupEvents: function() {
     //NOTE: inputs are bound in bindToggles,
     // so it can be called on refresh, too
@@ -584,14 +601,14 @@ $.widget( "mobile.table", $.mobile.table, {
   },
 
   _enhanceColToggle: function() {
-    var id , menuButton, popup, menu, front, back, slots, fill, i, sorts, btn, item,
+    var id, popup, menu,
       table = this.element,
       opts = this.options,
       ns = $.mobile.ns,
-      fragment = $.mobile.document[ 0 ].createDocumentFragment();
+      fragment = this.document[ 0 ].createDocumentFragment();
 
     id = this._id() + "-popup";
-    menuButton = $( "<a role='button' href='#" + id + "' " +
+    this._menuButton = $( "<a role='button' href='#" + id + "' " +
       "class='" + opts.classes.columnBtn + " ui-btn ui-btn-" + ( opts.columnBtnTheme || "a" ) + " ui-corner-all ui-shadow ui-mini ui-icon ui-btn-icon-left ui-icon-"+ opts.columnBtnIcon +"' " +
       "data-" + ns + "rel='popup' " +
       "data-" + ns + "icon='" + opts.columnBtnIcon + "' " +
@@ -604,89 +621,90 @@ $.widget( "mobile.table", $.mobile.table, {
 
     menu.appendTo( popup );
 
-    // wrappers
-    // TODO: not nice, should be possible to wrap top with 3 elements
-    // and then where do you put the toggle button
-    // TODO: also not nice, because no way to latch on the filter
-    // TODO: also not nice, because data-slot-id is not used.
-
-    if (opts.wrap) {
-      fill = table.parent().find( "div[data-slot]" );
-
-      if (opts.wrap === "both") {
-        front = this._generateWrapper( opts.topGrid ).addClass("ui-table-wrapper-top");
-        back = this._generateWrapper( opts.bottomGrid ).addClass("ui-table-wrapper-bottom");
-
-        if (fill) {
-          slots = front.add( back ).children("div");
-          for (i = 0; i < fill.length; i += 1) {
-            item = parseFloat(fill.eq(i).jqmData("slot-id"))-1;
-            fill.eq(i)
-              .find("label")
-              .addClass("ui-hidden-accessible")
-              .end()
-            // skip slot 2
-            .appendTo( slots.eq( item || (i === 2 ? 3 : i)) );
-          }
-        }
-        if (opts.columnBtnShow) {
-          front.children("div").last().append( menuButton[ 0 ] );
-        }
-        fragment.appendChild( front[ 0 ] );
-        fragment.appendChild( popup[ 0 ] );
-        // not possible in one-go...
-        table.before(fragment)
-        table.after(back);
+    fragment.appendChild( popup[ 0 ] );
+    if (opts.columnBtnShow) {
+      fragment.appendChild( this._menuButton[ 0 ] );
+    }
+    table.before( fragment );
 
-      } else {
-        front = this._generateWrapper( opts.topGrid || opts.bottomGrid || 3).addClass("ui-table-wrapper-top");
-
-        if (fill.length) {
-          slots = front.children("div");
-
-          for (i = 0; i < fill.length; i += 1) {
-            fill.eq(i)
-              .find("label")
-              .addClass("ui-hidden-accessible")
-              .end()
-            // skip slot 2
-            .appendTo( slots.eq( i === 2 ? 3 : i ) );
-          }
-        }
-        if (opts.columnBtnShow) {
-          front.children("div").last().append( menuButton[ 0 ] );
-        }
-        fragment.appendChild( front[ 0 ] );
-        fragment.appendChild( popup[ 0 ] );
+    popup.popup().enhanceWithin();
+
+    // always return the menu
+    return menu;
+  },
 
-        // not possible in one-go...
-        table[ opts.wrap === "top" ? "before" : "after"](fragment)
+
+  // wrappers
+  // TODO: not nice, should be possible to wrap top with 3 elements
+  // and then where do you put the toggle button
+  // TODO: also not nice, because no way to latch on the filter
+  // TODO: also not nice, because data-slot-id is not used.
+  _wrapTable: function () {
+    var front, back, slots, fill, i, item,
+      opts = this.options,
+      table = this.element;
+
+    fill = table.parent().find( "div[data-slot]" );
+
+    if (opts.wrap === "both") {
+      front = this._generateWrapper( opts.topGrid ).addClass("ui-table-wrapper-top");
+      back = this._generateWrapper( opts.bottomGrid ).addClass("ui-table-wrapper-bottom");
+
+      if (fill) {
+        slots = front.add( back ).children("div");
+        for (i = 0; i < fill.length; i += 1) {
+          item = parseFloat(fill.eq(i).jqmData("slot-id"))-1;
+          fill.eq(i)
+            .find("label")
+            .addClass("ui-hidden-accessible")
+            .end()
+          // skip slot 2
+          .appendTo( slots.eq( item || (i === 2 ? 3 : i)) );
+        }
       }
+      // move toggle button
+      if (opts.columnBtnShow && this._menuButton) {
+        front.children("div").last().append( this._menuButton[ 0 ] );
+      }
+
+      // not possible in one-go...
+      table.before(front);
+      table.after(back);
 
-    // no wrap
     } else {
-      fragment.appendChild( popup[ 0 ] );
+      front = this._generateWrapper( opts.topGrid || opts.bottomGrid || 3).addClass("ui-table-wrapper-top");
+
+      if (fill.length) {
+        slots = front.children("div");
+
+        for (i = 0; i < fill.length; i += 1) {
+          fill.eq(i)
+            .find("label")
+            .addClass("ui-hidden-accessible")
+            .end()
+          // skip slot 2
+          .appendTo( slots.eq( i === 2 ? 3 : i ) );
+        }
+      }
       if (opts.columnBtnShow) {
-        fragment.appendChild( menuButton[ 0 ] );
+        front.children("div").last().append( this._menuButton );
       }
-      table.before( fragment );
+
+      // not possible in one-go...
+      table[ opts.wrap === "top" ? "before" : "after"](front)
     }
+  },
 
-    if (opts.sort) {
-      sorts = table.find( "thead tr th[data-sorting]" );
+  _setSorting: function () {
+    var sorts = this.element.find( "thead tr th[data-sorting]" ),
       btn = $("<a />", {
         class: "ui-sorting ui-btn ui-icon-sort ui-icon ui-btn-icon-right",
       });
-      sorts.each(function(i, el) {
-        var $el = $(el);
-        $el.html( btn.clone().text( $el.text() ) );
-      });
-    }
-
-    popup.popup().children( "fieldset" ).controlgroup();
 
-    // always return the menu
-    return menu;
+    sorts.each(function(i, el) {
+      var $el = $(el);
+      $el.html( btn.clone().text( $el.text() ) );
+    });
   },
 
   rebuild: function() {
@@ -703,7 +721,7 @@ $.widget( "mobile.table", $.mobile.table, {
   _refresh: function( create ) {
     this._super( create );
 
-    if ( !create && this.options.mode === "columntoggle" ) {
+    if ( !create && this.options.mode === "columntoggle" && this.options.usePop ) {
       // columns not being replaced must be cleared from input toggle-locks
       this._unlockCells( this.allHeaders );