2

First of all, I apologize for my bad English. I'm trying to dynamically change the page theme with the function found in the jQuery mobile API documentation.

The function is like this:

$('[data-role="page"]').page( 'option', 'theme', 'b' );

If I run this function several times with different swatch themes, it adds the page CSS class theme for each swatch instead of switching it.

Example:

  • I load the page with default theme.

  • It adds in the page class:

    ui-page-theme-a

  • Then I execute:

    $('[data-role="page"]).page( 'option', 'theme', 'b' );

  • It adds:

    ui-page-theme-b

  • And removes:

    ui-page-theme-a

  • Then I execute:

    $('[data-role="page"]).page( 'option', 'theme', 'a' );

  • It adds:

    ui-page-theme-a

  • But does not remove:

    ui-page-theme-b

I don't know if this is the normal behavior (or happen only in my case) so I ask for clarification on this and in case this is the normal use, how to "emulate" a switch behavior? ( JQuery mobile 1.4.5)

Thanks.

Mirza Sisic
  • 2,401
  • 4
  • 24
  • 38
  • if you view the demo source code -- https://demos.jquerymobile.com/1.4.5/theme-default/ -- its done this way ($( "#pageid" ).removeClass( "ui-page-theme-a ui-page-theme-b" ).addClass( "ui-page-theme-" + themeClass );) -- themeClass is either a or b -- you need to do this for other elements in the page if they dont pick up the change – Tasos Feb 17 '16 at 19:10
  • @ Tasos Thanks man. I think this isn't an elegant solution. At least not for dinamically generated themes. I found just now that if i use the same function type for the toolbars (header and footer) the switch behavior work well. So i think it could only be a problem in Page version function. –  Feb 17 '16 at 21:16
  • I founed that the $('[data-role="panel"]').panel( 'option', 'theme', 'b' ); version do not work at all. –  Feb 17 '16 at 21:43
  • well theres another way of doing it and i think its much better -- have specific dark.css, light.css etc files and change them dynamically. this is what i used to do -- http://stackoverflow.com/questions/19844545/replacing-css-file-on-the-fly-and-apply-the-new-style-to-the-page – Tasos Feb 18 '16 at 02:06
  • 1
    Are you using both jquery ui and jquery mobile..? – T J Feb 18 '16 at 06:20
  • @TJ no i using only jquery mobile 1.4.5 –  Feb 18 '16 at 07:43
  • @Tungsteno Then please don't tag it. Only add relevant tags... – T J Feb 18 '16 at 08:37

0 Answers0