jquery ui button alignment on IE7 - jquery-ui

I have a form with an input element and a button and i'm using jquery ui for styling the button.
However in IE7 the button is not properly aligning with the input but works well in other browser like chrome or even IE8.
Is there a way to fix this ?

Related

jquery mobile + knockout hide issue

I am stuck on this, I am trying to unhide / hide jquery mobile flip switches using knockout. When knockout action is applied the jquery mobile controls stopped working. Could you please help me on this
here is the code
target.formattedValue(target());
return target;
and jsFiddle where the third control would hide if female selected but when male selected again the control disabled and not working
http://jsfiddle.net/FU7Nq/45
San.
When inspecting the rendered DOM of the following element:
<div data-bind="if: isMale">...</div>
you can see that after the radio button is changed to female, then the entire rendered HTML of that DIV is removed. Then, when switching back to the male, the content of that DIV is rendered back, but is this means that events are still attached to those slider HTML elements? I'm not sure how the way jQuery mobile attached the events, but it seems to me that this is the problem, cause you are clicking on the slider, but no action is taken. You can workaround this by recreating the Slider again:
$("#select-ifmale").slider()
Eventually this can be a bug in jQuery mobile. Sorry for suggesting this as an answer, but I don't have enough points, just to comment on your question.

Styled button appearing strange (using Bootstrap, jQuery Mobile) - double text

I'm getting this appearance in my form buttons - notice the double text. I'm using a style sheet generated from jQuery Mobile Download Builder (navigation, location push and transitions selected only). It seems to be jQuery Mobile that is causing this. I've tried data-enhanced="false" on the page div but doesn't seem to do anything. I don't want any styling from jQuery, just the navigation for graceful degradation. For styling, I'm using Bootstrap.
See button - http://ma.rtyn.biz/bizness/homepage2/form_button.png
<button type="submit" class="btn btn-default">Add</button>
Can anyone tell me how I can stop this from happening? I'd prefer to use a button tag rather than a link as I want it to submit the form without JavaScript.

Popup not hidden on iPhone in jQuery Mobile 1.3.1

According to the documentation for jQuery Mobile 1.2 it should be possible to make arbitrary divs popup without them being pages:
<div data-role="popup" id="popupHelp">I should be hidden</div>
Until this is clicked!
This seems to work fine in Chrome on the PC: The div is hidden until this is clicked and the popup is displayed.
On the iPhone however the div is displayed (with X close button) below the page footer before the link is clicked.
Is this a bug or some legacy code not supported in JQM 1.3.1?
PS: I'm aware this question has been asked but no appropriate answer was given.
In my experience, the jQM popup is still pretty finicky. Make sure your popup div is defined within your page's content div (<div data-role="content">).

jquery ui dialog disables input text and textarea

I have an html page which has some html form elements and jquery
if I open the html page as a standalone page, everything seems fine, however, if I open the page as jquery ui dialog whithin an aspx web forms page (I get the contents of the html page through jquery ajax method), the input elements text and textarea are not enabled, but select lists are enabled.
The problem is coused by modal property.
If the modal is false, then the fields are editable
Any ideas why this happens this?

jQuery UI dialog box appears at top of page while page is loading

I have a jQuery dialog box on my website. I give a div on the page the "dialog" id it's contents become the contents of the dialog box. However, when the page is loading, this div appears at the top of the page and looks bad. Does anyone know how to deal with this?
Just hide your div via your CSS file:
#dialog {display: none}
This will not affect its actual display when the dialog is opened.
I tested to be sure, and this method worked with jQuery UI 1.7.2
Assuming that the dialog is changing the 'display' style [eg using .show() and .hide()] then all jQueryUI is doing is setting the display style. thus, you can set the div with the display:none by default, and that way it won't show when you load.

Resources