- 724 Posts
- 3 Reply Likes
Posted 4 years ago
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
If you mean you have your html/css/js locally as a website, testing in a browser, then you are testing the wrong thing. That browser will not use the plugins, but rather the HTML5 API.
It means i am doing mistake in online/offline events because before it was showing map.Exactly.
- 724 Posts
- 3 Reply Likes
Now at this time I think the matter is not of php or HTML.
Petra Sir,
I used this script for online and offline.
Kindly help me to find error/bugs:
document.addEventListener("deviceready", onDeviceReady, false);
// PhoneGap is loaded and it is now safe to make calls PhoneGap methods
//
function onDeviceReady() {
checkConnection();
}
function checkConnection() {
var networkState = navigator.network.connection.type;
var states = {};
states[Connection.UNKNOWN] = 'Unknown connection';
states[Connection.ETHERNET] = 'Ethernet connection';
states[Connection.WIFI] = 'WiFi connection';
states[Connection.CELL_2G] = 'Cell 2G connection';
states[Connection.CELL_3G] = 'Cell 3G connection';
states[Connection.CELL_4G] = 'Cell 4G connection';
states[Connection.NONE] = 'No network connection';
alert('Connection type: ' + states[networkState]);
}
Onething more making me irretating e.g. everytime It's showing network like 2G, 3G, or 4G.
Q1.Is there another way to alert the offline and online status?
Q2.Where I should use this script in Index.html? or Complaints.php?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
I used this script for online and offline.It doesn't handle status changes. It merely displays the value of navigator.network.connection.type
- Why shouldn't that be 2G, 3G or 4G?
- Did you copy that code from an old source, which was not updated since Cordova 2.3.0?
Q1.Is there another way to alert the offline and online status?Well, when starting to use a plugin you don't know yet, you should first read the official plugin documentation and not simply copy code from any third party sources.
Then you would:
a) find the proper objects and methods/properties
b) find examples of how to get the current status and (more importantly) status changes.
Q2.Where I should use this script in Index.html? or Complaints.php?By now, you should understand why javascript never goes in some PHP script. And since that code includes the callback for the deviceready event, you should have no doubt where it is to be placed.
- 724 Posts
- 3 Reply Likes
-Yes I got it.
Thank You
- 724 Posts
- 3 Reply Likes
document.addEventListener("offline", onOffline, false);
function onOffline() {
alert("No Internet Access");
}
function onOnline() {
// Handle the online event
var networkState = navigator.connection.type;
if (networkState !== Connection.NONE) {
Petra what I do here? Or I can leave it empty, if i dont want to show any alert?
}
display('Connection type: ' + networkState);
}
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
However, you should check the connection right after the app was launched, so you have an 'anchor point'. If that device is offline already when the app starts, what would you like to happen, then?
- 724 Posts
- 3 Reply Likes
2. If a user is already offline, i want when he launch the app, an instant msg show "Please check your Internet Connection" or "No Internet Access" before submitting the form, and when he is online no msg show.
My app have four options, three can use offline too e.g. share the app offline, call to employee, and help. But the post complain option they can't process without internet connection.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
- create a separate html page, nicely styled, with a message "You are currently offline - the app will continue automatically as soon as you have a connection"
- if the Complaint form is about to be shown, check the connection. If offline, show the new page, otherwise the Complaint form - if the Complaint form is being displayed, catch the online/offline event. If changed to offline, show the new page. If changed to online, go back to the previous page (which is the form)
Quite easy, right?
- 724 Posts
- 3 Reply Likes
Or I can handle these events at Index.html too?
-You want I use an HTML page instead of a dialog/alert box with a message.
-Should I catch online/offline events at Complaint page?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
So, In this condition I must use javascript with Complaint_form.php?No, of course not. Your php scripts are not witin your assets, and javascript is not parsed and executed on your server.
You want I use an HTML page instead of a dialog/alert box with a message.I would suggest that, yes. It looks better and can be handled easier, at least when the device is returning to online status
Should I catch online/offline events at Complaint page?That would be the only logical place, yes. After all, only there the connection status is relevant, as you said.
- 724 Posts
- 3 Reply Likes
Your php scripts are not witin your assets, and javascript is not parsed and executed on your server.
It means I should not use javascript in Complaint.php page! But in this page i used some jave script for:
My Complaint.php page is divided in many sections:
1.Header
2.Form
3. Static Map Image
(I used here java script for static map)
4.Dynamic Picklist.
(I used here java script to fetch data from database)
5.Add Image.
Without javascript how i can do that two tasks?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Forget it.
No PHP in the app.
And no javascript in your PHP web service scripts.
See the first page of this thread, where I answered your question to Chris.
- 724 Posts
- 3 Reply Likes
Actually from beginning i was in a big confusion.
Because I read somewhere this:
xhttp.open("POST", "ajax_test.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("fname=Henry&lname=Ford");
I thought I will use like this ajax calls.
-I didn't use php script anywhere in complaint.php, i am changing it's extension to complaint.html.
BUT Petra I have still confusion that how i will post data from html page to remote server.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
That is: if you want to use ajax/xhr to post to your web service at all. Like I already said weeks ago, you have yet to decide whether you use that or rather the file-transfer plugin.
- 724 Posts
- 3 Reply Likes
jQuery Ajax Post Data Example
jQuery $.post() method is used to request data from a webpage and to display the returned result (sent from requested page) on to that webpage from where the request has been sent without page refresh.
$.post() method sends request along with some data using an HTTP POST request.
Under this, a request is send to a webpage (here it is jquery_post.php) from another page (say jquery_send.php) using syntax :
$.post( URL, data, callback);
In this way?
-Anytype of posting data e.g. jQuery or vanilla javascript, the file transfer plugin is necessary right?
I am new to ajax calls i can't decide petra, u just tell me which is better for me.
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
In this way?Yes
-Anytype of posting data e.g. jQuery or vanilla javascript, the file transfer plugin is necessary right?No, it's either one
I am new to ajax calls i can't decide petra, u just tell me which is better for me.Whatever you are more comfortable with, or whatever you would like to learn. One method is not better than the other one.
- If you want to learn about ajax/xhr together with jQuery and server side techniques, there are good beginner books available, such as
http://www.amazon.com/Learning-PHP-My...
http://www.amazon.com/AJAX-PHP-Buildi...
http://www.amazon.com/Head-First-Ajax...
- If you want to learn about the file-ransfer plgin, you'd probably want to study this
https://www.npmjs.com/package/cordova...
...and practice a lot, first.
In any case, you'd need a web service script at the server side which handles the requests and returns the proper data in case of success or error. Also, you would adapt the server script and database to your choice, because you'd most likely post the image as base64 data in the former, and as binary in the latter case.
- 724 Posts
- 3 Reply Likes
-file transfer plugin i will use because i am sending base64 image files to server?
-U said either one? which one jQuery or vanilla javascript?
Ok Petra thank you to suggest me those links I will study but after. ajax calls is last step, so i want to fix old problems first!
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Should I rename Complaint.php to complaint.html, coz of javascript?Is there any PHP in your file Complaint.php?
If so, then it has no business in your mobile app, regardless of the file extension.
If not, why was it named Complaint.php in the first place?
But how about ajax calling time? what name I will use there?Are you asking me for the name of your web service script at server side? Or are you asking for the document name in which the ajax request is coded?
file transfer plugin i will use because i am sending base64 image files to server?No, the file transfer plugin transfers files.
U said either one? which one jQuery or vanilla javascript?No, I meant to say:
- pick either ajax post request or the file transfer plugin
- pick either vanilla javascript or jQuery (but don't mix as much as you're doing now)
- 724 Posts
- 3 Reply Likes
Is there any PHP in your file Complaint.php?
If so, then it has no business in your mobile app, regardless of the file extension.
If not, why was it named Complaint.php in the first place?
Here is a form for submission, thats y I named it Complaint.php. I will use post in this page therefore I used name Complaint.php.
Are you asking me for the name of your web service script at server side? Or are you asking for the document name in which the ajax request is coded?
I am asking here the URL, which file name with which extension.
$.post( URL, data, callback);
Petra, I still used javascript, Can I use now jQuery Mobile for posting data?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
$.post( URL, data, callback);The URL would be your web service script, for instance:
var URL = "http://saba.com/api/appservice.php";
Petra, I still used javascript, Can I use now jQuery Mobile for posting data?You could. If you want to use jQuery Mobile, you would work through this jQM Docs example:
http://demos.jquerymobile.com/1.2.0/d...
However, if you'd rather use jQuery instead, you'd use these docs:
http://api.jquery.com/jquery.ajax/
https://api.jquery.com/jquery.post/
- 724 Posts
- 3 Reply Likes
appsservice.php
In this file which type script we will use?
Thanks for links :)
wanna ask:
Are u an employee of PGB Team?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
Are u an employee of PGB Team?No. They don't take bots as employee.
appsservice.phpCan be either Python, Perl, or Ruby, Or something else, depending on what your server offers and what you are comfortable with.
In this file which type script we will use?
- 724 Posts
- 3 Reply Likes
-Perl,Ruby or Php also?
- 724 Posts
- 3 Reply Likes
Kindly check the coding i am using is correct?
function onLoad() {
document.addEventListener("offline", onOffline, false);
document.addEventListener("online", onOnline, false);
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady() {
}
function onOnline() {
// Only go back if user went to offline.html
if ($.mobile.activePage[0].baseURI.indexOf("offline.html") > -1) {
$.mobile.back();
}
}
//
function onOffline() {
$.mobile.changePage("offline.html");
}
I will handle it at complaint.html right?
- 724 Posts
- 3 Reply Likes
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
If I do that, the next thing you will ask me is "now, finish that ajax part for me, then finish the web service part for me and ....".
As a result, I would still be writing your app.
- 724 Posts
- 3 Reply Likes
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
My App is near about to complete.
Only 20% left, can u please complete it?
So, no, I don't believe it.
You can't make promises like this, because you don't have a clear picture of what is still there ahead of you...all kinds of things that you will also need help with, because you won't be able to code it by yourself (or by copying and pasting all kinds of bits from everywhere).
- 724 Posts
- 3 Reply Likes
-Icons and splashes
-ipad status bar plugin
-network-information plugin
-check complaint status
-dialog boxes and alerts
-ajax calls and etc...................
and once I have said that I will complete this app in a weak, So I was really unknown, slightly I am learning Petra, I was wrong yeah.
If you don't believe, then don't.
I can't avoid your favors, you are not a bot. Sorry
I wish you could see how busy I m here, in small age handling my home with 12 hours duty,i am creating this app, If i was free, or If this was my profession, I could complete it soon.
This is very difficult to concentrate at two ways one your job, and your work apart from duty.
I am not asking for your pity, of course NOT.
By d way thanks alot to help me yet.
- 724 Posts
- 3 Reply Likes
You always denied when i asked about code snippet.
Then i try myself to do, and ask for your help, Now i need your help.
I am using this javascript for complaint.html
var app = {
initialize: function () {
document.addEventListener("deviceready", app.onDeviceReady, false);
document.addEventListener("online", app.onOnline, false);
document.addEventListener("offline", app.onOffline, false);
}, onDeviceReady: function () {
}, onOnline: function(){
}, onOffline: function(){
window.location.href = "offline.html";
}
};
app.initialize();
and this is my offline page:
and this is script i am using to reload this page:
<script>
function myFunction() {
location.reload();
}
</script>
THe Offline.html page is showing when app going offline.
Now what I want:
I want when a user launch the app and open Post Complaint Option. If device is offline, this offline page appear with reload image, and when he open data, device come online and he reload the image this page goes hide/close.
So for this i will again check online/offline status at offline.html page?
Can we check network status in same app more than one time?
Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
1. Because you are using jQuery and jQM, you shouldn't mess with window.location. Rather, use the change() method or the changePage() method (depending on which version of jQM you are using) to switch pages.
2. Why would you want to reload that 'offline' page? Just leave it on as long as the user is offline.
3. The online/offline events are fired as soon as the plugin detects a connection change. The respective callback is then executed immediately. So, there is no action required and you don't have to check the network status repeatedly.
See the network-informationplugin's documentation.
4. However, you need to check the network status once, before the form gets displayed. If the connection is off, you should immediately show the offline page, and not the form..
The 'online' event needs to be caught on the offline.html, and in its callback, you should change to the previous page.
5. Be aware that the eventListener will remain in effect, even if the user leaves the complaint form. If you want to prevent the online/offline from being fired when the user is not at the complaint form, make sure that you remove the eventListeners immediately.
- 724 Posts
- 3 Reply Likes
But I was scaring to use JQM because In the beginning when i start to develop this app, I was using JQuery Mobile with the help of dreamweaver. I saw that some plugins were not working with JQM. I asked to Sir Jesse, He said his apps (for camera and call number) not work on JQM.
So I again start to develop my app with no JQM.
So can u please clear me what is the matter of JQM with PGB?
Thats y I used javascript instead of JQM.
This was the version:

Petra V., Champion
- 7794 Posts
- 1391 Reply Likes
yes, my apps do not work with JQuery Mobile. I do not use JQuery Mobile. I can not help you with JQuery Mobile. My Apps are simple and intended only as demos (demonstration apps).
He didn't say that PGB apps generally don't work with jQM.
They do...I am using it myself.
You should, however, use a somewhat modern version. Version 1.0 is from Nov. 2011! And jQuery 1.6.4 is from Sept. 2011. You can't expect such old versions to support current code bases you copy and paste nowadays.
See
http://jquerymobile.com/download/
https://jquery.com/download/
- 724 Posts
- 3 Reply Likes
- 724 Posts
- 3 Reply Likes
Related Categories
-
PhoneGap Build
- 15111 Conversations
- 275 Followers
-
Plugins
- 1283 Conversations
- 38 Followers


