I have created one dynamic select box using jquery mobile android application.It was created good, but when i am going to next list view page and get back to the same select box page.The select box is disappear.The page is displaying as blank. For your reference i have attached my select box creation code here.Anything i missed in this. Please tell me the answer. Thanks in advance.
function candidate(id)
{
window.localStorage.setItem("ojtid",id);
$('#cadidateid').find('option').remove();
var content='';
db.transaction(function (tx)
{
tx.executeSql('select * from xxx where xxid="'+id+'" and status="1"', [], function (tx, result)
{
if(result.rows.length > 0)
{
alert("This is already attended");
}
else
{
tx.executeSql('SELECT distinct emp_id,emp_name FROM yyy where yyid="'+id+'" group by emp_id ORDER BY emp_name ASC', [], function (tx, results)
{
content=content+"<option value='0'>-- Select --</option>";
for (var i = 0; i < results.rows.length; i++)
{
content=content+'<option value="'+results.rows.item(i).emp_id+'">'+results.rows.item(i).emp_name+'</option>';
}
console.log("content:"+content);
$("#cadidateid").append(content).trigger('create');
$('#cadidateid').selectmenu().selectmenu('refresh', true);
});
}
$.mobile.changePage($("#ojtcandidate"));
});
});
}
Html Code:
<div data-role="page" id="ojtcandidate" data-theme="b">
<div data-role="header" data-theme="b">
<h1>Ojt Candidate</h1>
</div>
<div data-role="main" class="ui-content">
<label for="day">Select Candidate</label>
<form>
<fieldset class="ui-field-contain">
<select name="cadidateid" id="cadidateid" data-native-menu="false">
</select>
</fieldset>
</form>
<input type="button" value="Submit" onClick="session();">
</div>
</div>