DataZombies / jQTouch

jQT extensions jqt.activityIndicator, jqt.bars (with numeric badges), jqt.checkGroup & jqt.segmentedControl.Get updates via Twitter http://twitter.com/HeadDZombie. If you find this fork useful please make a donation via PayPal (http://tinyurl.com/2fpmx27). See below for demo links.
MIT License
159 stars 34 forks source link

Am I being dumb? - can't seem to get scrollToElement working with Zombies iScroll #34

Closed LouMazz closed 13 years ago

LouMazz commented 13 years ago

I see references to it in jqtbars,js, and I see in iscroll,js, but I can't reference it in my code. Is there a way to so this through the exposed jqtbars interface? If not, can there be?

DataZombies commented 13 years ago

Each page's iScroll object lived in the page's "data" attribute. To scroll to an element on the current page with ID="JFSebastian" you would use... $('.current').data('iscroll').scrollToElement('#JFSebastian', '0ms'); The 0ms is the delay. Check out lines 485 - 495 in jqt.bars.js for an example.

P.S.: No, you aren't being dumb.

LouMazz commented 13 years ago

Had read the code and understand the "delay" parm.
Can't see any "data" attribute in the debugger. Having a hard time translating your pattern to my DOM:

<div id ="itemList" class="s-pane" class="current">
    <div class="toolbar>
         toolbar stuff
    </div>
    <div id="itemListStatus"></div>
    <div id="itemListBody" class="s-scrollwrapper" ... >
        <div="s-scrollpane" ... >
            <ul>
                <li>
                    <input type="checkbox" ... value="6,0,0,1,1" checked>
                                                         .
                </li>
                     .
            </ul>
         </div>
     <div>
</div>

I would like to write:

$('current').data(<the right thing>).scrollToElement(':input[value^="' + G_baseItemID + ']', '0ms');

the above selector is known good for other uses in my code.

Is this possible?

DataZombies commented 13 years ago

Looks ok, except that the div with the s-scrollpane class needs an ID. <div id="itemListScrollPane" class="s-scrollpane" ... > The iScroll object is attached to the div that has the current class: $('.current').data('iscroll').scrollToElement(':input[value^="' + G_baseItemID + ']', '0ms'); I did notice that you didn't have the period between the single quote and current. That might be the problem. If you load you app in Safari and in the Web Inspector's Console type... $('.current').data() ...you'll see an object with iscroll in it. It doesn't show up in the Web Inspector's Metrics, Properties or Event Listeners sections. According to the developer's docs (http://cubiq.org/iscroll): scrollToElement(el, runtime): scrolls to any element inside the scrolling area. el must be a CSS3 selector. Eg: scrollToElement("#elementID", '400ms'). Does your ':input[....' return an ID? If so you might have to prefix that input with '#'.

That's all I can think of for now. Please keep me posted on your progress. djp

LouMazz commented 13 years ago

Thanks for feedback - I'm getting a SYNTAX_ERR: DOM Exception 12 when I try to scrollToElement. I guess the selector is not recognized - jQuery handles it just fine. Don't know if reworking my DOM is worth the effort for this.

BTW, do you have any experience with Spinning Wheel? I'm wrestling with a stinker of a bug in there (I'm a magnet or something...)

DataZombies commented 13 years ago

According to http://kobesearch.cpan.org/htdocs/CSS-DOM/CSS/DOM/Exception.html#SYNTAX_ERR_12 Err 12 is... SYNTAX_ERR (12) - If an invalid or illegal string is specified Does the element you want to scroll to have an ID? The scrollToElement is expecting an ID. The ':input[...' is returning an object, not the object's ID. Try this... var target = $(':input[value^="' + G_baseItemID + ']') scrollToElement('#' + target.id) If you mean cubiq's Spinning Wheel, I've only used it once last year. Send an email with your issue to DataZombies@gmail.com & I'll see what I can do. Your best bet may be to post the problem to http://groups.google.com/group/iscroll, though.