CODEWITHSUNDEEP
jquerycssjquery-mobilejplayerdocument-ready
ElliotDurden
ElliotDurden

Reputation: 49

Jquery mobile and Jquery Jplayer conflict

I am having an issue with Jquery Mobile and Jquery Jplayer conflicting with each other. The problem I am facing is that When you include Jquery Jplayer into a Jquery mobile website and you click the button to start listening to an audio, it changes the button html and that changes the look and feel of the website because Jquery mobile doesn't just change the html, it adds the following code.

<span class="ui-btn-inner ui-btn-corner-all">
<span class="ui-btn-text">Continue</span>
</span>

Everytime I try to overwrite it, by including the following script:

$(this).html('Continue');

It just doesn't work. Any idea what to do in this situation?

Upvotes: 0

Views: 581

Answers (2)

Ricardo Souza
Ricardo Souza

Reputation: 16456

To update jQuery Mobile UI elements you have to call .refresh() on the items after modifying the source element (only works with form elements, not link buttons).

$(this).html('Continue').button('refresh');

Or Change button text jquery mobile

$("#consumed .ui-btn-text").text("Mark New");

.

If your element is a button:

$(this).closest(".ui-btn").find(".ui-btn-text").text("Continue");

If its a link:

$(this).find(".ui-btn-text").text("Continue");

Upvotes: 0

Lowkase
Lowkase

Reputation: 5699

If you have downloaded JQM with themes then JQM will override basic elements in your styles and any plugin styles.

There is a download for structure only JQM css: http://code.jquery.com/mobile/1.1.0/jquery.mobile.structure-1.1.0.css

There are a few options here:

1) Go into your CSS and do JQM overrides to achieve consistent styles if they are different than the boxed themes.

2) Create your own JQM theme.

3) Question if you really need to use the JQM framework. Many times I start with JQM, only to replace much of the functionality with micro javascript/jQuery solutions. If you find yourself stripping JQM functionality out and replacing it with something else then you should question if using JQM is the best approach.

Upvotes: 1

Related Questions