I got a problem and I hope you guys can help me solve it.
I have this function in which I want to use autocomplete. With the help below, I managed to remove the error but now it just doesn't work when using Ajax. Like I wrote before, the bottom script (inbox.php) is loaded inside the top script (home.php).
I found out that the autocomplete script works if I open the page seperately (so just going to localhost/inbox.php), but when going through Ajax, it loses this. That's why I think now, that the problem is in the Ajax script, which can be found at the last part of the examples.
home.php (main page)
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="homeV2.css" type="text/css" media="screen">
<script type="text/javascript" src="javascript/index.js"></script>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.4.js'></script>
<script type='text/javascript' src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.0/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.0/themes/black-tie/jquery-ui.css">
<title>
Homepage Westpop Intranet
</title>
<script>
window.onload = function()
{
showHome(<?=$gid?>);
refreshChat();
countdown();
}
</script>
</head>
inbox.php (this page is loaded inside home.php, using Ajax)
<script type="text/javascript">
var names = ['hi', 'bye', 'foo', 'bar'];
$(document).ready(function() {
$("#inputNaam").autocomplete({
source: names
});
});
</script>
............ //some other script
</div>
</div>
<div id='profielNieuwBericht'>
<div id='nieuwBerichtKop'>
Nieuw bericht
</div>
<table>
<tr>
<td>Aan: </td>
<td><input type='text' class='inputNieuwBericht' id='inputNaam' /> </td>
</tr>
<tr>
<td> Onderwerp: </td>
<td> <input type='text' class='inputNieuwBericht' id='inputOnderwerp' /></td>
</table>
<textarea id='BerichtTextarea'></textarea></br>
<input type='button' id='BerichtManagementButton' value='Stuur' />
</div>
</div>
And this is the Ajax part. This script is being called when clicking on a button in home.php (link not included, but is called through onClick='showInbox(id)').
function showInbox(id){
if (id==''){
document.getElementById("middenpag").innerHTML="";
return;
}
if (window.XMLHttpRequest){
xmlhttp=new XMLHttpRequest();
}
else{
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("middenpag").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","inbox.php?id="+id,true);
xmlhttp.send();
}
I hope you guys can see what I am doing wrong here!
Thank you :)
Phonegap navigation and session maintenance
I am trying to convert a website to a phonegap android application. The web server sets the session id on the client as a cookie. This session id has to be maintained for the complete session.
When I move from one page to another ( the second page is a local html file in the app), using href, or window.location, or navigator.app.loadUrl, it loads the second page in a browser, and the cookies get destroyed, so I can't make an valid ajax request from the second page.
I wouldn't prefer putting all the pages in a single html file ( like jquery mobile) .
Given that I have seperate html files, how to navigate between them, such that the second page is loaded in the same webview,( so that the cookies are preserved) rather than in a browser. Do I have to create another activity for it ?
Is there any other way of navigation in phonegap, except those mentioned above ? Or is the only way of staying in the same webview is to dynamically load pages using ajax and replace the existing page with them ?
Another possibility is I can parse the session id from the response, store it in the local storage and append with every request. But this cookie is HTTP Read only, so I can't read it using javascript