im developing a mobile app which is based on jqm and local storage
you can view it here:
clients/app2u/Apps/6/home.html
clients/app2u/Apps/6/gallery.html
clients/app2u/Apps/6/categories.html
etc'
local storage contains data for each page (for example: "app2u_app6_home") and a general tab data ("app2u_app6_Tabs")
the problem is that on first visit to the page, the page loads before the data is completely load, and only if you refresh the page the page will contain the data.
how can i force the page to show only after the local storage is ready?
Note: I am assuming you are referring to the getPageData function in functions.js on your site.
Your problem is that the $.post call is asynchronous (unlike the call to localStorage.getItem) so your getPageData function cannot return immediately.
Instead, you should refactor it to accept a callback function:
function getPageData(page,wait,extra_data,callback) {
if (localStorage.getItem(unique_param+page)) {
callback(localStorage.getItem(unique_param+page, extra_data));
} else {
if (typeof(extra_data) == 'undefined') {extra_data = '';}
$.post(server_path + 'index.php?module=API&pname=' + page + '&pmode=empg&application_id=' + application_id + extra_data,
function(response) {
localStorage.setItem(unique_param+page,JSON.stringify(response));
callback(response);
}
,'json'
);
}
}
Using this method, your code will always wait for either the call to local storage or the call to the server to complete
Related
I have a requirement to oData service inside onExit hook method. I have written below code but unfortunately oData service is not getting called as view is destroyed immediately . Is there any way to add wait or delay the destroy of view until oData read request is complete ?
window.addEventListener("beforeunload", (event) => {
this.fnUnlockGremienVersion();
var s;
event = event || window.event;
if (this._PreviousGreVersion) {
s = "Your most recent changes are still being saved. " +
"If you close the window now, they may not be saved.";
event.returnValue = s;
return s;
}
});
UI5 has no support for such a workflow and it's not only "UI5", in fact webpages can't block/trap a user within a page for various reasons. Just remember the annoying un-closable webpages from the 2000s. Browser dropped support for such things; except a very simple pop-up api which is supported by UI5.
i assume you are in the shell.
Use the dirty flag properly(set it as long there are unsaved changes or a request still running) and the user will get a popup.
https://sapui5.hana.ondemand.com/sdk/#/api/sap.ushell.services.Container%23methods/setDirtyFlag
<button class="alt-button" ion-item detail-none (click)="goToAbout()" clear small >
<ion-icon name='person' item-left></ion-icon>About us</button>
Button action
goToAbout() {
this.menu.close();
// close the menu and Goto About page
this.app.getRootNav().push(AboutPage);
}
api call
ionViewDidLoad(){
this.loading.present();
this.aboutservice.getPost().then(
response => {
this.items = response
this.loading.dismiss();
},
error=>{
this.error = error
this.showError('There was problem with server');
this.loading.dismiss();
});
}
it loads the api data everytime,but I want to load api data once and same button action i have used for sidemenu,Its working fine.please give any idea.
It seems strange behavior according to the doc here.
ionViewDidLoad
Runs when the page has loaded. This event only happens once per page
being created. If a page leaves but is cached, then this event will
not fire again on a subsequent viewing. The ionViewDidLoad event is
good place to put your setup code for the page.
But you can use it inside the constructor() as shown below.
constructor() {
//your Api call here
}
I am using PhoneGap build + jQuery Mobile (1.4+) with this plugin: http://www.pushwoosh.com/programming-push-notification/ios/ios-additional-platforms/push-notification-sdk-integration-for-phonegap/
It works all fine for me, what I want to do though is be able to send a jQuery mobile URL (example #test) in custom data which is sent as 'JSON'? Then jQuery Mobile will load the jQuery Page in the app.
Could someone show me how I could implement this? At this stage I have:
//push notifications handler
document.addEventListener('push-notification', function(event) {
var notification = event.notification;
// navigator.notification.alert(notification.aps.alert);
//to view full push payload
// navigator.notification.alert(JSON.stringify(notification));
//reset badges on icon
pushNotification.setApplicationIconBadgeNumber(0);
});
http://www.pushwoosh.com/programming-push-notification/pushwoosh-push-notification-remote-api/
Their example is {"key" : "value"} so assume mine is {"url" : "#test"}
Thanks,
Ben
i hope this still relevant (or for future searches), you can retrieve the data from the notification.u object
example:
if( typeof(notification.u.url) != "undefined" ) {
// do whatever here
}
I'm developing a jquery mobile site that is only available to users that are logged in.
I have a function that checks a server for their logged in status:
function checkLogin() {
$(function () {
$.getJSON(root_url + 'manageUsers/checklogin/?callback=?', null,
function (data) {
if (data.logged == 'false') {
$("#index_Container").html("<h2>Login Required</h2></div><p>We've noticed you're not logged in, please login to use this app.</p><p><a href='login.html' data-role='button'>Click here to login</a></p>").trigger('create');
$.mobile.changePage('login.html');
} else {
$(".logged_in").text(data.username);
$(".logged_in").addClass('logout');
$(".header_div").trigger('create');
}
});
});
}
I can't seem to figure out how to implement this so everytime the index page is loaded and any other page loads this is fired prior to rendering anything else on the page. Currently, the page will load and show the HTML, then do $.mobile.changePage('login.html'):
EDIT: If anyone has any ideas on how to implement this in a better way I'd love to know, every page in the app requires the user to be logged in.
In order to have this function run every time you load anew page, you will need to bind it to the pagebeforeload event, and potentially cancel the user navigation if it does not validate the login.
$( document ).bind( "pagebeforeshow", function( event, data ){
event.preventDefault(); //prevents usual load of page
checkLogin(data);
});
You will have to make changes to checkLogin, notably because as the page does not exist yet, so you cannot make changes to the DOM. You can see an quick and dirty example in this fiddle, giving hints as to how do it considering the asynchronous nature of your call.
There are several questions on Stack Overflow saying cross domain AJAX request etc will not work because of security reasons. Some questions like this explain this. (Please let me know if I am wrong.)
This is working perfectly fine:
$(document).ready(function() {
$.getJSON("http://search.twitter.com/search.json?q=test&callback=?", function(data) {
alert("test alert outside loop");
$.each(data.results, function() {
alert("test alert inside loop");
});
});
});
But just replacing the URL with my application won't work. In that case response code is 200, but there's no response data. There is an hit on my application; I can see that in console.
$(document).ready(function() {
$.getJSON("http://192.168.1.2:3000/cities.json?callback=?", function(data) {
alert("test alert outside loop");
$.each(data.results, function() {
alert("test alert inside loop");
});
});
});
I am developing a very simple mobile app using PhoneGap so I need to make this call using JavaScript. But the main thing that's confusing me is why the Twitter call is working, but the call to my app isn't. I've also tried to remove the protect_from_forgery call in my application controller in my Rails app, but i don't think that matters.
EDIT
i have deployed the app on http://deals.textadda.com/cities.json now check it... Its not working..
U can try it. these two links http://jsfiddle.net/2arbY/
http://jsfiddle.net/fHxf9/
you are running into cross-domain issues due to same-origin-policy the ip you are trying to get the json from should reside on the same sever from which you are originating the request.
try using
$.getJSON("192.168.1.2/cities.json?callback=?", func
Probably data.results doesn't exist, even if data does. What do you get if you alert(data); (or console.log(data); ) outside the loop?
EDIT
Your app isn't generating a callback wrapper. For instance, http://deals.textadda.com/cities.json?callback=abc should generate a JSON object wrapped in a function call of abc, in the same way, for example, the twitter response does: http://search.twitter.com/search.json?q=test&callback=abc.
The problem is that this remote server returns JSON, not JSONP. It returns:
{"lines":[{"line":"COLOMBO - BADULLA"},{"line":"COLOMBO - MATALE"},{"line":"COLOMBO - PUTTLAM"},{"line":"COLOMBO - THANDIKULAM"},{"line":"COLOMBO - TALAIMANNAR"},{"line":"COLOMBO - BATTICALOA"},{"line":"COLOMBO - TRINCOMALEE"},{"line":"COLOMBO - MATARA"},{"line":"COLOMBO - AVISSAWELLA"},{"line":"COLOMBO - MIHINTALE"}]}
instead of:
someCallbackName({"lines":[{"line":"COLOMBO - BADULLA"},{"line":"COLOMBO - MATALE"},{"line":"COLOMBO - PUTTLAM"},{"line":"COLOMBO - THANDIKULAM"},{"line":"COLOMBO - TALAIMANNAR"},{"line":"COLOMBO - BATTICALOA"},{"line":"COLOMBO - TRINCOMALEE"},{"line":"COLOMBO - MATARA"},{"line":"COLOMBO - AVISSAWELLA"},{"line":"COLOMBO - MIHINTALE"}]})
Thats why I was not be able to consume a remote domain using AJAX unless this remote resource supports JSONP.