<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css">
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
</head>
<body>
<div data-role="page" id="home">
<div data-role="header">
<h1>jQuery Mobile loadPage() Method</h1>
</div>
<div data-role="content" id="content_container">
<form id="my_form">
<input type="text" id="name" />
<input type="text" id="surname"/>
<input type="button" id="yes">
</form>
</div>
</div>
<script>
var storePageLoaded = false;
$(document).on('click', '#yes', function() {
$.ajax({
type: "POST",
url: "searchresult.php",
data: $("form#my_form").serialize(),
success: function(data){
$.each(data, function(i, elem) {
nic_list.push({label: elem['p_nic']});
});
}
}).done(function (data) {
$.mobile.changePage('next-page.html',{transition:"slide"});
}).fail(function (jqXHR, textStatus) {
alert(error);
});
return false;
});
</script>
I created this page to send some form data to php file and print the data in a another page.But when i try this i get following error .I have change the code little bit to retrieve the data .It works fine but i need to populate the data next-page.html
10-14 11:10:05.108: E/Web Console(9066): Uncaught TypeError: Object #<Object> has no method 'jqmData' at http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js:2
$(document).on('click', '#yes', function() {
$.ajax({
type: "POST",
url: "searchresult.php",
data: $("form#my_form").serialize(),
success: function(response){
alert(success);
}
}).done(function (data) {
$.mobile.changePage('next-page.html',{transition:"slide"});
}).fail(function (jqXHR, textStatus) {
alert(error);
});
return false;
});
Related
I'm using Phonegap and FCM to send push notification in android. Currently I'm receiving push notification and it's redirecting me to a page at tapping on the notification when the app is active. But when in background or closed, it just opens the index page of the app and doesn't redirect to my page.
Here are my codes,
index.js
var app = {
initialize: function() {
this.bindEvents();
},
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
document.addEventListener("pause", this.onPause, false);
document.addEventListener("resume", this.onResume, false);
},
onDeviceReady: function() {
window.FirebasePlugin.getToken(function(token) {
document.getElementById("deviceToken").value = token;
}, function(error) {
console.error(error);
});
},
onPause: function() {
window.FirebasePlugin.onNotificationOpen(function(notification) {
window.location.href = "orders.html"; // Redirecting to this page on notification
}, function(error) {
console.error(error);
});
},
onResume: function() {
window.FirebasePlugin.onNotificationOpen(function(notification) {
window.location.href = "orders.html"; // Redirecting to this page on notification
}, function(error) {
console.error(error);
});
},
}
index.html
<body>
<div class="app" style="display: none;">
<div id="deviceready" class="blink">
<p class="event listening">Connecting to Device</p>
<p class="event received">Device is Ready</p>
<input type="hidden" id="deviceToken" />
</div>
</div>
<script src="cordova.js"></script>
<script src="js/index.js"></script>
<script>
app.initialize();
</script>
</body>
Is there anything wrong in my code? How can I redirect to my page upon tapping the notification when app is in background or closed?
I want to post data to the above link(in spite of using a webservice) using cordova and angularjs. I have used alerts in between to know which functions are working properly. sign Up Function is not working, it is entering the function but not entering the request method to post data.
Is there any error in request.success(function(data)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport"content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<meta name="msapplication-tap-highlight" content="no" />
<title>Post Data</title>
</head>
<body>
<div ng-app="HelloApp" ng-controller="HelloCtrl">
<form role="form" action="#">
<div>
Name: <input type="text" ng-model="name"><br>
Country: <input type="text" ng-model="country"><br>
Twitter: <input type="text" ng-model="twitter"><br>
<button ng-click="signUp()">Save</button><br>
<span>{{responseMessage}}</span>
</form>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.js"></script>
<script type="text/javascript">
app.initialize();
</script>
<script>
alert('Before controller');
var helloApp = angular.module("HelloApp", []);
helloApp.controller("HelloCtrl", [ '$scope','$http', function($scope,$http)
{
alert('Entered Controller');
$scope.name = "Calvin Hobbes";
$scope.country = "US";
$scope.twitter = "as#gmail.com";
$scope.signUp = function () {
/* $scope.Message = "Button clicked."*/
alert("Button CLicked");;
var request = $http({
method: "post",
dataType:'json',
url: "http://hmkcode.appspot.com/jsonservlet",
crossDomain : true,
data: {
'name': $scope.name,
'country': $scope.country,
'twitter': $scope.twitter
},
headers: { 'Accept':' text/plain','Content-Type': 'textjson' }
});
/* Successful HTTP post request or not */
request.success(function(data) {
alert("success function");
if(data == "1"){
$scope.responseMessage = "Successfull";
}
if(data == "2"){
$scope.responseMessage = "failed";
} else if(data == "0") {
$scope.responseMessage = "Error";
}
});
}
}]);
</script>
</body>
</html>
How can i post the data to the webservice(http://hmkcode.appspot.com/jsonservlet)
You have to change your controller the following way. Since you are using the new version of angularjs, change .success to .then. And also when you are using form, it is better to use ng-submit
JS:
$scope.signUp = function () {
/* $scope.Message = "Button clicked."*/
alert("Button CLicked");;
var request = $http({
method: "post",
dataType:'json',
url: "http://hmkcode.appspot.com/jsonservlet",
crossDomain : true,
data: {
'name': $scope.name,
'country': $scope.country,
'twitter': $scope.twitter
},
headers: { 'Accept':' text/plain','Content-Type': 'application/json' }
});
/* Successful HTTP post request or not */
request.then(function(data) {
alert("success function");
if(data.data == "1"){
$scope.responseMessage = "Successfull";
}
if(data.data == "2"){
$scope.responseMessage = "failed";
} else if(data.data == "0") {
$scope.responseMessage = "Error";
}
});
}
HTML:
<form role="form" ng-submit="signUp()">
<div>
Name: <input type="text" ng-model="name"><br>
Country: <input type="text" ng-model="country"><br>
Twitter: <input type="text" ng-model="twitter"><br>
<button type="submit">Save</button><br>
<span>{{responseMessage}}</span>
</form>
I newbie in Phonegap Android App Development. I am trying to connect my App with remote MS SQL Server Database, I wrote an ASP.Net Web-service also to connect these two.
But when I call this Web-service via JQuery ajax() method it returns "Internal Server Error".
Code :
<html>
<head>
<title>PhoneGap Example</title>
<script type="text/javascript" charset="utf-8" src="js/cordova.js"></script>
<link rel="stylesheet" href="css/jquery.mobile.css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.mobile.js"></script>
<script type="text/javascript" >
function button_clicked(){
var name = $.trim($("#txtName").val());
var contact = $.trim($("#txtContactNumber").val());
var type = $.trim($("#txtType").val());
if(name.length > 0)
{
$.ajax({
type: "POST",
url: "http://my-domain.com/DocNote_WebService/DoctorMaster.asmx/insertDoctor",
data: "{doctorName: "+ name + ",contactNumber: "+ contact + ",doctorType: " + type +"}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success : function(data) {
alert('Record Saved Sucessfully.....!!!!');
},
error: function(xhr, ajaxOptions, thrownError) {
alert('ERROR: '+thrownError);
}
});
}
}
</script>
</head>
<body>
<section id="page1">
<header><h1>DocNote</h1></header>
<div class="content" data-role="content">
<h3>Enter Doctor Info</h3>
<div data-role="fieldcontain">
<input type="text" data-clear-btn="true" name="txtName" id="txtName" placeholder="Enter Name"/>
<br/>
<input type="text" data-clear-btn="true" name="txtContactNumber" id="txtContactNumber" placeholder="Contact Number"/>
<br/>
<input type="text" data-clear-btn="true" name="txtType" id="txtType" placeholder="Type"/>
<br/>
<button id="btnSubmit" class="ui-btn ui-btn-inline ui-corner-all" onclick="button_clicked()">Submit</button>
<button id="btnCancel" class="ui-btn ui-btn-inline ui-corner-all">Cancel</button>
</div>
</div>
</section>
</body>
</html>
My Web-service Method :
[WebMethod]
public void insertDoctor(String doctorName, String contactNumber, int doctorType) {
using (SqlConnection connection = ConnectionFactory.getConnection())
{
SqlCommand sqlCommand = new SqlCommand("Insert into DOCTOR_MASTER (DOCTOR_NAME, DOCTOR_CONTACT_NUMBER,DOCTOR_TYPE) values (#name,#contact,#type)",connection);
sqlCommand.Parameters.AddWithValue("#name", doctorName);
sqlCommand.Parameters.AddWithValue("#contact",contactNumber);
sqlCommand.Parameters.AddWithValue("#type", doctorType);
sqlCommand.ExecuteNonQuery();
}
}
Tell me what I am doing wrong .....
Thanks in Advance .........
Pass the data as an object, not a string...
$.ajax({
type: "POST",
url: "http://my-domain.com/DocNote_WebService/DoctorMaster.asmx/insertDoctor",
data: {
"doctorName": name,
"contactNumber": contact,
"doctorType": type
},
contentType: "application/json; charset=utf-8",
dataType: "json",
success : function(data) {
alert('Record Saved Sucessfully.....!!!!');
},
error: function(xhr, ajaxOptions, thrownError) {
alert('ERROR: '+thrownError);
}
});
Finally, I found Solution Here.
data: "{ firstName: 'Aidy', lastName: 'F' }"
Then, I modified my Code and it Worked.
$.ajax({
type: "POST",
url: "http://my-domain.com/DocNote_WebService/DoctorMaster.asmx/insertDoctor",
data: "{doctorName:'" + doctorName + "', contactNumber:'" + contactNumber + "', doctorType:'" + doctorType + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success : function(response) {
alert('Record Saved Sucessfully.....!!!!');
},
error: function(xhr, ajaxOptions, thrownError) {
alert('ERROR: '+thrownError);
}
});
I am developing one application in PhoneGap in that application i want to share text-message in Facebook,twitter and LinkedIn. for ANDROID-LinkedIn i am searching many Google links but i am getting good one. please help me i am struck here
I am implementing this sample:
<html>
<head>
<title>OAuthSimple w/ LinkedIn</title>
<script src="OAuthSimple.js"></script>
<script>
/*
You must edit the two following lines and put in your consumer key and shared secret
*/
var consumer_key = "ibmay1qostgk";
var shared_secret = "4HqeDRZ2ZKAvASlM";
/*
Nothing below here needs to be edited for the demo to operate
*/
var oauth_info = {};
var oauth = OAuthSimple(consumer_key, shared_secret);
function parse_response(response, callback)
{
response.replace(new RegExp("([^?=&]+)(=([^&]*))?", "g"), function($0, $1, $2, $3) { oauth_info[$1] = $3; });
callback.call();
}
function authorize_url()
34{
set_url("https://www.linkedin.com/uas/oauth/authenticate?oauth_token=" + oauth_info.oauth_token, document.getElementById("au"));
}
function access_token_url(pin) {
oauth.reset();
var url = oauth.sign({action: "GET", path: "https://api.linkedin.com/uas/oauth/accessToken", parameters: {oauth_verifier: pin}, signatures: oauth_info}).signed_url;
set_url(url, document.getElementById("at"));
}
function fetch_profile_url() {
oauth.reset();
var url = oauth.sign({action: "GET", path: "https://api.linkedin.com/v1/people/~", signatures: oauth_info}).signed_url;
set_url(url, document.getElementById("fp"));
}
function set_url(url, element) {
element.value = url;
var span = document.createElement("span");
span.innerHTML = " <a href='" + url + "' target='_blank'>Open</a>";
element.parentNode.insertBefore(span, element.nextSibling);
}
window.onload = function() {
var url = oauth.sign({action: "GET", path: "https://api.linkedin.com/uas/oauth/requestToken", parameters: {oauth_callback: "oob"}}).signed_url;
set_url(url, document.getElementById("rt"));
}
</script>
</head>
<body>
<h1>OAuthSimple w/ LinkedIn</h1>
<label for="rt">Request Token URL:</label> <input type="text" size="100" name="rt" id="rt" >
<br><br>
<label for="rtr">Request Token Response:</label><br><textarea rows="5" cols="75" name="rtr" id="rtr"></textarea>
<br>
<button onclick="javascript:parse_response(document.getElementById('rtr').value, authorize_url)">Parse Response</button>
<br><br>
<label for="au">Authorize URL:</label> <input type="text" size="100" name="au" id="au">
<br><br>
<label for="vp">Verifier PIN Code:</label> <input type="text" size="100" name="vp" id="vp">
<button onclick="javascript:access_token_url(document.getElementById('vp').value)">Get Access Token URL</button>
<br><br>
<label for="at">Access Token URL:</label> <input type="text" size="100" name="at" id="at">
<br><br>
<label for="atr">Access Token Response:</label><br><textarea rows="5" cols="75" name="atr" id="atr"></textarea>
<br>
<button onclick="javascript:parse_response(document.getElementById('atr').value, fetch_profile_url)">Parse Response</button>
<br><br>
<label for="fp">Fetch Profile URL:</label> <input type="text" size="100" name="fp" id="fp">
</body>
</html>
thanks in advance
Heres a full example of login and sending msg linkedIn using Phonegap
ref = window.open('https://www.linkedin.com/uas/oauth2/authorization?response_type=code&client_id=APIKEY&scope=w_messages r_network r_emailaddress r_fullprofile&state=APISECRET&redirect_uri=SOMEACTIVESITE','_blank','location=no');
ref.addEventListener('loadstart', function(e){
$.mobile.loading( 'show' );
if(e.url.indexOf('?code=') >=0 ){
if(e.url.match(/=[^]+&/)){
var code = e.url.match(/=[^]+&/)[0].substring(1).replace('&','');
window.sessionStorage.setItem('code', code);
ref.close();
$.ajax({
url: 'https://www.linkedin.com/uas/oauth2/accessToken?grant_type=authorization_code&code='+code+'&redirect_uri=http://janbeeangeles.com&client_id=jwwwdjplwubu&client_secret=ygMy3EpVcs6IAORE',
success: function(a){
$.ajax({
url : 'https://api.linkedin.com/v1/people/~/mailbox?oauth2_access_token='+a.access_token,
type: 'post',
headers : {
'Content-Type' : 'application/json',
'x-li-format' : 'json'
},
data: JSON.stringify({
"recipients": {
"values": [
{
"person": {
"_path": "/people/~",
}
}]
},
"subject": "asdasdasd on your new position.",
"body": "You are certainly the best person for the job!"
}),
success: function(a){
alert(2222)
},
error: function(a){
alert(JSON.stringify(a))
}
})
},
error: function(a){
alert(JSON.stringify(a))
}
})
}
}
});
I'm trying to send a getJson call from my app (login form) to get an external JSON from PHP file. and there if login and password are ok. My app will redirect from login.html to home.html.
This is my script located in login.html shown below
<script>
function testlogin() {
var login = $('#login').val();
var password = $('#password').val();
$.ajax({
url: "http://http://10.0.2.2/YasmineMarket.php",
data: { login: JSON.stringify(login), password: JSON.stringify(password) },
dataType: "jsonp",
success: function(json, textstatus) {
if (json.d == 'Login Success') {
var url = "acceuil.html";
$(location).attr('href', url);
}
else {
alert("Wrong Username or password");
var url = "index.html";
$(location).attr('href', url);
}
},
error: function(xmlHttpRequest, textStatus, errorThrown) {
if (xmlHttpRequest.readyState == 0 || xmlHttpRequest.status == 0)
return;
else
alert(errorThrown);
}
});
}
</script>
<!DOCTYPE HTML>
<html >
<form id="loginForm" method="GET" >
<table border="0" align="center">
<tr><td></td></tr>
<tr><td align="center"><input type="text" name="login" id="login" /></td></tr>
<br>
<tr><td align="center"><input type="password" name="password" id="password" /></td></tr>
<tr><td align="center"><input type="submit" value="Connexion" onlick="testlogin();" class="button" /></td></tr>
</table>
</form>
</body>
This code is not sufficient to find the actual problem here. But this link might help you to write a server authentication. Please go through my old post about jsonp ajax request to a web server using jquery mobile and phonegap.