lundi 9 octobre 2017

Checkboxes in jQuery Mobile Scroll View

Is there any reason why checkboxes in the hidden portion of a scrolled window in a jQuery Mobile popup dialog does not work and simply jumps to the top?

    <div data-role="popup" id="chkSelector" data-overlay-theme="a"  
        data-theme="a" data-dismissible="true">

        <div style="width:500px; height:300px; overflow-y:auto;">
            <label for="checkbox-1">021669835973</label> 
            <input name="checkbox-1" id="checkbox-1" type="checkbox">
            <label for="checkbox-2">021669835976</label> 
            <input name="checkbox-2" id="checkbox-2" type="checkbox">
            <label for="checkbox-3">021669835983</label> 
            <input name="checkbox-3" id="checkbox-3" type="checkbox">
            <label for="checkbox-4">021669836973</label> 
            <input name="checkbox-4" id="checkbox-4" type="checkbox">
            <label for="checkbox-5">021669837973</label> 
            <input name="checkbox-5" id="checkbox-5" type="checkbox">
            <label for="checkbox-6">021669855973</label> 
            <input name="checkbox-6" id="checkbox-6" type="checkbox">
            <label for="checkbox-7">021669935973</label> 
            <input name="checkbox-7" id="checkbox-7" type="checkbox">
            <label for="checkbox-8">021669835973</label> 
            <input name="checkbox-8" id="checkbox-8" type="checkbox">
            <label for="checkbox-9">021669835976</label> 
            <input name="checkbox-9" id="checkbox-9" type="checkbox">
            <label for="checkbox-10">021669835983</label> 
            <input name="checkbox-10" id="checkbox-10" type="checkbox">
            <label for="checkbox-11">021669836973</label> 
            <input name="checkbox-11" id="checkbox-11" type="checkbox">
            <label for="checkbox-12">021669837973</label> 
            <input name="checkbox-12" id="checkbox-12" type="checkbox">
            <label for="checkbox-13">021669855973</label> 
            <input name="checkbox-13" id="checkbox-13" type="checkbox">
            <label for="checkbox-14">021669935973</label> 
            <input name="checkbox-14" id="checkbox-14" type="checkbox">                         
        </div> 

    </div>

Only the top ones not cut off below the window height can be selected. Whe the lower ones are scrolled into view and selected, the list just scrolls to the top without selecting it.




Aucun commentaire:

Enregistrer un commentaire