scrollbar for dynamic div using jquery or javascript (android phonegap)

239 views
Skip to first unread message

mohana priya

unread,
Apr 20, 2012, 3:08:29 AM4/20/12
to phonegap
I have created application in android phonegap.In my application I
have appended list in div dynamically . I want to add scrollbar for
dynamic div using iscroll.My code is

Html:


<div class="sidemenu" ></div>

</div>
Style:
#scroller
{
top:90px;
position:absolute; z-index:1;
width:90%;
height:40px;
background-color:#FFFFFF;
}
li
{
list-style:none;
}
Script:

iscroll:
var myScroll;
function loaded() {
myScroll = new iScroll('scroller', {
useTransform: false,
vScroll: true,
onBeforeScrollStart: function (e) {
var target = e.target;
while (target.nodeType != 1) target =
target.parentNode;

if (target.tagName != 'SELECT' && target.tagName !
= 'INPUT' && target.tagName != 'TEXTAREA')
e.preventDefault();
}
});
}
document.addEventListener('touchmove', function (e)
{ e.preventDefault(); }, false);
document.addEventListener('DOMContentLoaded',
setTimeout(function () { loaded(); }, 0), false);


/** scrollbar for dynamic div*/
function doIscrollRefresh () {
setTimeout(function () {
myScroll.refresh();
}, 0);

}
dynamic div:
I have retrived value from localdatabase and appended into div
dynamically
function list1(alphabet)
{
doIscrollRefresh ();
document.addEventListener("deviceready", onDeviceReady,
false);
function onDeviceReady()
{

var db = window.openDatabase("createdb", "1.0",
"PhoneGap Demo", 200000);

db.transaction(queryDB, errorCB,successCB);

}
function queryDB(tx)
{
var a=alphabet;
tx.executeSql("SELECT Textvalue FROM TextValue
WHERE Textvalue LIKE '" + a + "%'",[], querySuccess, errorCB);
}

function querySuccess(tx,results)
{
$(".sidemenu").append("<li>"+"<label
style='background-color:#C1CDD9' >"+alphabet+ "</label>"+"</li>");
for (i = 0; i < results.rows.length; i++)
{
$(".sidemenu").append("<li>"+"<a id='"+i+"'
href='#'>" +results.rows.item(i).Textvalue + "</a>"+ "<hr/>"+ "</
li>");
}
$(".sidemenu").append("<hr/>");
}
function errorCB(err)
{
alert("Error processing SQL: "+err.code);
}
function successCB()
{
//alert("appended");
}
}


how to add the scrollbar dynamically? It show the error in logcat.the
error is myScroll is undefined is not an object. Please tell me the
solution.how to addthe scrollbar for dynamic div.please guide
me.thanks in advance

Babu K

unread,
Apr 21, 2012, 2:10:42 AM4/21/12
to phonegap
Hi Priya,
iscroll work on onbody load time only.
Reply all
Reply to author
Forward
0 new messages