New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

After updating JQM from rc1 to rc3 textbox to the left of the slider has disappeared #3081

Closed
alexavrutin opened this Issue Nov 17, 2011 · 8 comments

Comments

Projects
None yet
4 participants
@alexavrutin

alexavrutin commented Nov 17, 2011

Now I have another, native slider nearby. It only happens if slider is on a page loaded as a dialog. The code did not change, it's shown below (code is ASP.NET MVC3 Razor).

                <div data-role="fieldcontain">
                    @Html.LabelFor(m => m.AgeFrom)
                    <input type="range" name="AgeFrom" id="searchSettings-AgeFrom" min="16" max="70"
    onchange="SearchSettingsChangeAgeFrom();" value="@Model.AgeFrom" />
                </div>
                <div data-role="fieldcontain">
                    @Html.LabelFor(m => m.AgeTo)
                    <input type="range" name="AgeTo" id="searchSettings-AgeTo" value = "@Model.AgeTo" min="16" max="70" onchange="SearchSettingsChangeAgeTo();" />
                </div>
@eddiemonge

This comment has been minimized.

Show comment
Hide comment
@eddiemonge

eddiemonge Nov 18, 2011

Contributor

Can you test using the 1.0 code?

Also, can you paste the generated markup for those of us who refuse to touch ASP?

One more thing, what device/browser?

Contributor

eddiemonge commented Nov 18, 2011

Can you test using the 1.0 code?

Also, can you paste the generated markup for those of us who refuse to touch ASP?

One more thing, what device/browser?

@alexavrutin

This comment has been minimized.

Show comment
Hide comment
@alexavrutin

alexavrutin Nov 20, 2011

Hello Eddie,

Thank you for email. I linked the 1.0 JS file but left the CSS file from
RC3 since I did a few changes in it --- the problem still exists. Someone
on the forums confirmed that the problem does exist in 1.0 (
http://forum.jquery.com/topic/after-updating-jqm-from-rc1-to-rc3-textbox-to-the-left-of-the-slider-has-disappeared
)

I tested in Chrome, Opera and Firefox on Windows 7. Firefox does display
text fields as expected but the other two render a native slider. I did not
test it on mobile devices yet.

The code is below, copied from the Chrome development tool:

Weight
                    </div>

Hope it helps.

Thank you,
Alex

2011/11/19 Eddie Monge Jr. <
reply@reply.github.com

Can you test using the 1.0 code?

Also, can you paste the generated markup for those of us who refuse to
touch ASP?

One more thing, what device/browser?


Reply to this email directly or view it on GitHub:
#3081 (comment)

alexavrutin commented Nov 20, 2011

Hello Eddie,

Thank you for email. I linked the 1.0 JS file but left the CSS file from
RC3 since I did a few changes in it --- the problem still exists. Someone
on the forums confirmed that the problem does exist in 1.0 (
http://forum.jquery.com/topic/after-updating-jqm-from-rc1-to-rc3-textbox-to-the-left-of-the-slider-has-disappeared
)

I tested in Chrome, Opera and Firefox on Windows 7. Firefox does display
text fields as expected but the other two render a native slider. I did not
test it on mobile devices yet.

The code is below, copied from the Chrome development tool:

Weight
                    </div>

Hope it helps.

Thank you,
Alex

2011/11/19 Eddie Monge Jr. <
reply@reply.github.com

Can you test using the 1.0 code?

Also, can you paste the generated markup for those of us who refuse to
touch ASP?

One more thing, what device/browser?


Reply to this email directly or view it on GitHub:
#3081 (comment)

@eddiemonge

This comment has been minimized.

Show comment
Hide comment
@eddiemonge

eddiemonge Nov 20, 2011

Contributor

Can you paste it at jsfiddle.com or jsbin.com so we can see a live example

Contributor

eddiemonge commented Nov 20, 2011

Can you paste it at jsfiddle.com or jsbin.com so we can see a live example

@alexavrutin

This comment has been minimized.

Show comment
Hide comment
@alexavrutin

alexavrutin Nov 20, 2011

Okay, will do tomorrow.

Alex

alexavrutin commented Nov 20, 2011

Okay, will do tomorrow.

Alex

@eromba

This comment has been minimized.

Show comment
Hide comment
@eromba

eromba Nov 21, 2011

Contributor

I've run into this issue myself using jQM 1.0. Slider textboxes are fine on normal pages, but are missing on dialogs. The degradeInputs plugin seems to be the culprit -- it bails early for pages that do not have data-role="page".

The following change fixed the issue for me:

@@ -3649,7 +3649,7 @@ $.mobile.page.prototype.options.degradeInputs = {
 //auto self-init widgets
 $( document ).bind( "pagecreate create", function( e ){

-   var page = $(e.target).closest(':jqmData(role="page")').data("page"), options;
+   var page = $(e.target).closest(':jqmData(role="page"),:jqmData(role="dialog")').data("page"), options;

    if( !page ) {
        return;
Contributor

eromba commented Nov 21, 2011

I've run into this issue myself using jQM 1.0. Slider textboxes are fine on normal pages, but are missing on dialogs. The degradeInputs plugin seems to be the culprit -- it bails early for pages that do not have data-role="page".

The following change fixed the issue for me:

@@ -3649,7 +3649,7 @@ $.mobile.page.prototype.options.degradeInputs = {
 //auto self-init widgets
 $( document ).bind( "pagecreate create", function( e ){

-   var page = $(e.target).closest(':jqmData(role="page")').data("page"), options;
+   var page = $(e.target).closest(':jqmData(role="page"),:jqmData(role="dialog")').data("page"), options;

    if( !page ) {
        return;
@alexavrutin

This comment has been minimized.

Show comment
Hide comment
@alexavrutin

alexavrutin Nov 21, 2011

Yup, it works!

alexavrutin commented Nov 21, 2011

Yup, it works!

@eddiemonge

This comment has been minimized.

Show comment
Hide comment
@eddiemonge

eddiemonge Nov 21, 2011

Contributor

Can you submit that as a pull request please?

Contributor

eddiemonge commented Nov 21, 2011

Can you submit that as a pull request please?

eromba added a commit to eromba/jquery-mobile that referenced this issue Nov 21, 2011

Issue #3081: Range inputs on dialogs don't degrade
The degradeInputs plugin bails early for pages that do not have
data-role="page". This behavior prevented range inputs (for slider widgets)
from degrading properly when used in dialogs.

Updated degradeInputs unit tests to check dialogs, too.
@johnbender

This comment has been minimized.

Show comment
Hide comment
@johnbender

johnbender Dec 9, 2011

Contributor

Pull request merged: #3131

Contributor

johnbender commented Dec 9, 2011

Pull request merged: #3131

@johnbender johnbender closed this Dec 9, 2011

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment