Menu
Hello everyone and thanx in advance. I am using Phonegap 2.1.0. In whitelist everything is accepted..
**<access uri="*" subdomains="true" />
<access origin=".*" subdomains="true"/>**
I am using this function to call a remote php file from my university web server:
var postData = $(this).serialize();
$.ajax({
type: 'POST',
url: 'http://--/smartphone/login.php',
dataType : 'json',
data: postData,
success: function(data){
alert("good");
},
error: function(){
alert('problem!');
}
});
THE php file is just for debug reasons like this:
<?php
header('Content-Type: application/json');
$sample = array(
'name'=>'My Name',
'email'=>'[email protected]'
);
echo json_encode($sample);
?>
But ajax request is not happening.. in eclipse i keep getting this error when i click submit:
JSCallback Error: Request failed with status 0 at file:///android_asset/www/js/cordova-2.1.0.js:3743
what is more, I forgot to add, is that I can open the url as a link from the emulator.It works fine.
*html code:*
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/index.css" />
<script type="text/javascript" charset="utf-8" src="js/cordova-2.1.0.js"></script>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<title>Smart Greenhouse</title>
</head>
<body>
<div id="container">
<img src="css/images/smart_green_house.png" class="logo" alt="l1ogo" />
<form id="login_form" class="first_display" >
<label class="title"> E-mail:</label>
<input id="1" type="email" class="input" size="45" name="email" />
<label class="title"> password:</label>
<input id="2" type="password" class="input" size="45" name="password" />
<input id="3" class="submit_type" type="submit" value="login" />
</form>
</div>
</body>
</html>
I have searched I think pretty much the whole web...2 days searching...everything has been tested.. Thanx a lot..
361
Finally, after 4-5 days searching..something worked out for me..I just added return false after the ajax callback. And i changed the code as following:
$('form').submit(function(e){
if (password_ok==1 && email_ok==1)
{
var postData = $(this).serialize();
$.ajax({
type: 'POST',
url: 'http://mysite.xx.x/smartphone/login.php',
dataType : 'json',
data: postData,
success: function(data){
alert(data);
},
error: function(){
alert('error!');
}
});
}
else
{
e.preventDefault();
if (email_ok==2)
{
$("#1").css("border-color","red");
$("#1").css("background-color","#FFD8CE");
}
if (password_ok==2)
{
$("#2").css("border-color","red");
$("#2").css("background-color","#FFD8CE");
}
}
return false;
});
Now the only problem is that it does not reset the page when successful..but one step at time...
81
Step 1 :You need to include two headers in your php file
header('Content-Type: application/json');
header("Access-Control-Allow-Origin: *");
Step 2 :And include cdn jquery library in your index page.
step 3 :use script to post the form successfully
<script type="text/javascript">
$(document).ready(function() {
$('form').submit(function(e) {
var postData = $(this).serialize();
$.ajax({
type : 'POST',
url : 'http://www.yoururl/test.php',
dataType : 'json',
data : postData,
success : function(data) {
alert(data);
},
error : function() {
alert('error!');
}
});
return false;
});
});
</script>
I have tested it in phonegap and it is working fine.
34
I think the reason is caused by "Form submission". Where did you put your ajax code? In the index.js?
The exception you got means "0 == Page is unloading."
In your case, i guess you put your ajax codes in index.js which is in the same page with the form. When you submit the form, browser starts to unload current page and load page with results of form submitting. So your ajax codes get the exception "Page is unloading".
Try not to use Form submission.
37
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
