How can i stop jQuery mobile to apply styles to my specific form elements
Is it possible to instruct jQuery Mobile to not style my Input box and submit button. I am good with my custom CSS. jQuery mobile script is applying its own style to all my elements.
the one workaround i tried is overriding those elements in my custom css. Is there any other functions available where i can do this ? some thing like this
$.ignoreStyles("button,text");
jQuery Mobile will ignore elements whose data-role
attributes are set to none
. Therefore, you can simply add these attributes to your markup:
<input type="text" name="foo" data-role="none" />
<button type="button" id="bar" data-role="none">Button</button>
This works for me.
$(document).bind("mobileinit", function() {
$.mobile.ignoreContentEnabled = true;
});
<div data-enhance="false">
<input type="checkbox" name="chkbox1" id="chkbox1"
checked />
<label for="chkbox1">Checkbox</label>
<input type="radio" name="radiobtn1" id="radiobtn1"
checked />
<label for="radiobtn1">Radio Button</label>
</div>
@angelokh solution worked for me. Also look at the following link:
http://my.safaribooksonline.com/book/-/9781849517225/7dot-configurations/ch07s06_html
Also the key is to add the following script before including jquery.mobile.js:
$(document).bind("mobileinit", function() {
$.mobile.ignoreContentEnabled = true;
});