Tuesday, March 13, 2012

I got to study this set of Javascript code. It's the heart of communication between the Phonegap and ASP.NET web service.

Sim4All Blog


$(document).ready(function () {
document.addEventListener("deviceready", onDeviceReady, false);
});

// phonegap is initialised
function onDeviceReady() {
$("#welcomeMsg").append("...Ready");
}

function showAlert(msg) {
//alert(msg);
}

function showError(error, otherInfo) {
var element = document.getElementById('errorMessage');
element.innerHTML = "Errors: " + error.Message + "
" + (otherInfo ? otherInfo : "");
}

function getAjax() {
var jqxhr = $.ajax({
url: '../service1/',
//headers:
beforeSend: function (xhr) {
//xhr.overrideMimeType('text/plain; charset=x-user-defined');
},
dataType: 'json'
})
.done(function (data) {
var element = document.getElementById('ajaxCall');
element.innerHTML = JSON.stringify(data, null, "\t");
})
.fail(function (xhr, status, error) {
showError(error);
})
.always(function () { showAlert("complete"); });
}

function postAjax(parameters) {
var jqxhr = $.ajax({
url: '../service1/',
type: 'POST',
//headers:
//beforeSend: function (xhr) {
//},
dataType: 'json',
contentType: 'application/json; charset=utf-8',
data: '{ "Id":2, "StringValue": "jerry" }'
})
.done(function (data) {
var element = document.getElementById('postAjaxCall');
element.innerHTML = JSON.stringify(data, null, "\t");
})
.fail(function (xhr, status, error) { showError(error); })
.always(function () { showAlert("complete"); });
}

function login() {
var jqxhr = $.ajax({
url: '../login/',
type: 'POST',
//headers:
//beforeSend: function (xhr) {
//},
dataType: 'json',
contentType: 'application/json; charset=utf-8',
data: '{ "Username":"test", "Password": "test" }'
})
.done(function (data) {
var element = document.getElementById('loginCall');
element.innerHTML = "Login Succesfull ? " + data;
})
.fail(function (xhr, status, error) { showError(error); })
.always(function () { showAlert("complete"); });
}

function logout() {
var jqxhr = $.ajax({
url: '../login/logout',
type: 'POST',
//headers:
//beforeSend: function (xhr) {
//},
dataType: 'json',
contentType: 'application/json; charset=utf-8'
})
.done(function (data) {
var element = document.getElementById('logoutCall');
element.innerHTML = "Login Out Succesfull ? " + data;
})
.fail(function (xhr, status, error) { showError(error); })
.always(function () { showAlert("complete"); });
}

function getSingle(parameters) {
var jqxhr = $.ajax({
url: '../service1/88',
type: 'GET',
//headers:
beforeSend: function (xhr) {
//xhr.overrideMimeType('text/plain; charset=x-user-defined');
},
dataType: 'json',
contentType: 'application/json; charset=utf-8'
})
.done(function (data) {
var element = document.getElementById('getSingleCall');
element.innerHTML = JSON.stringify(data, null, "\t");
})
.fail(function (xhr, status, error) { showError(error); })
.always(function () { showAlert("complete"); });
}

function deleteSingle(parameters) {
var jqxhr = $.ajax({
url: '../service1/88',
type: 'DELETE',
//headers:
beforeSend: function (xhr) {
//xhr.overrideMimeType('text/plain; charset=x-user-defined');
},
dataType: 'json',
contentType: 'application/json; charset=utf-8'
})
.done(function (data) {
var element = document.getElementById('deleteSingleCall');
element.innerHTML = JSON.stringify(data, null, "\t");
})
.fail(function (xhr, status, error) { showError(error); })
.always(function () { showAlert("complete"); });
}

function updateSingle(parameters) {
var jqxhr = $.ajax({
url: '../service1/99',
type: 'PUT',
//headers:
beforeSend: function (xhr) {
//xhr.overrideMimeType('text/plain; charset=x-user-defined');
},
dataType: 'json',
contentType: 'application/json; charset=utf-8',
data: '{ "Id":99, "StringValue": "JERRY " }'
})
.done(function (data) {
var element = document.getElementById('updateSingleCall');
element.innerHTML = JSON.stringify(data, null, "\t");
})
.fail(function (xhr, status, error) { showError(error); })
.always(function () { showAlert("complete"); });
}

function identify(parameters) {
var jqxhr = $.ajax({
url: '../login/identify',
type: 'GET',
dataType: 'json',
contentType: 'application/json; charset=utf-8'
})
.done(function (data) {
var element = document.getElementById('identifyCall');
element.innerHTML = JSON.stringify(data, null, "\t");
})
.fail(function (xhr, status, error) { showError(error); })
.always(function () { showAlert("complete"); });
}

function logViaForm() {
var jqxhr = $.ajax({
url: '../login.aspx',
type: 'GET',
dataType: 'html'
})
.done(function (data) {
var eventVal = $(data).find('#__EVENTVALIDATION').attr('value');
var viewState = $(data).find('#__VIEWSTATE').attr('value');
//build post data
var postData = { __VIEWSTATE: viewState, __EVENTVALIDATION: eventVal, UserName: "test", Password: "test", LoginButton: "Log In" };

var jqxhr1 = $.ajax({
url: '../login.aspx',
type: 'POST',
dataType: 'html',
contentType: 'application/x-www-form-urlencoded; charset=utf-8',
data: postData
})
.done(function (data1, status, jqxhr1) {
//this works but we will get an error dues to the redirect to the home.aspx
//TODO: need to handle that
var element = document.getElementById('logViaFormCall');
element.innerHTML = "Login Succesfull ! " + jqxhr1.status;
})
.fail(function (xhr, status, error) {
showError(error, "TODO: Works but need to handle redirect!!");

//but it really works!
var element = document.getElementById('logViaFormCall');
element.innerHTML = "Login Succesfull ! Verify that Authenticated AJAX calls work!";
})
.always(function () { showAlert("complete login"); });
})
.fail(function (xhr, status, error) { showError(error); })
.always(function () { showAlert("complete"); });
}

1 comment: