Running a jquery mobile web app in a disconnected state? - javascript

I've been toying with writing a web app using jquery mobile which makes use of forms (cehckboxes, text fields, combo boxes). The tasks the app requires are fairly trivial but the information needs to be updated and sent to a server.
So my question is, say someone uses the app, gets a bunch of data from a server, then loses connection. Will the browser still remember the form fields input and could the user still navigate between pages? From my understanding jquery mobile places all its pages in the same 'webpage' so it's not like it will have to be constantly loading up new data from the server.
My idea is that I'll run some script in the background to check for a connection to a server and when it gets this connection it can go ahead and sync data with the server.
Is this possible or is it a pipe dream?

for jquery mobile it append all the data it had in same page so user can use only those links which are already clicked for the links that user have not touch yet will create problem

Related

AJAX - How can I build a notification system, that is constantly getting updated, without slowing down my website too much?

I am a beginner to web development, and I am trying to do a notification system with AJAX and jQuery.
In my web application, I have a comment system where you can mention another user. After a comment mentioning a certain user has been written, a new entry on my notifications table will be added, containing the comment, the id of the user who commented and the id of the user(s) who will receive the comment. After the notification is stored in the database, I want the person that was mentioned to receive the notification.
To that effect, I decided to use AJAX. Using the setTimeout() method, I am sending an AJAX request to the database every 2 seconds, and with that, I can display the notifications visually to the user that is meant to receive them.
My only concern is that this will slow down the site once I connect it with a server.
So, I was looking for a way that would allow me to implement a notifications system without slowing the site too much, since the one that I am using currently doesn't seem very efficient.
I would appreciate any help.

Dynamically update static webpage with python script

So I'm using a Raspberry Pi 2 with a rfid scanner and wrote a script in python that logs people in and out of our attendance system, connects to our postgresql database and returns some data like how much overtime they have and whether their action was a login or logout.
This data is meant to be displayed on a very basic webpage (that is not even on a server or anything) that just serves as a graphical interface to display said data.
My problem is that I cannot figure out how to dynamically display that data that my python script returns on the webpage without having to refresh it. I'd like it to simply fade in the information, keep it there for a few seconds and then have it fade out again (at which point the system becomes available again to have someone else login or logout).
Currently I'm using BeautifulSoup4 to edit the Html File and Chrome with the extension "LivePage" to then automatically update the page which is obviously a horrible solution.
I'm hoping someone here can point me in the right direction as to how I can accoumplish this in a comprehensible and reasonably elegant way.
TL;DR: I want to display the results of my python script on my web page without having to refresh it.
you can make a html file and send XHR request to the primary one every x seconds .
setTimeout(function(){
$.get( "yourPrimaryFile.xyz", function( data ) {
$( "body" )
.append(data) // Mr.X
}) }, 3000);
I assume an more or less obvious solution like building a REST API with e.g. Flask and using some javascript framework (e.g. Angular or React) on the frontend is out of scope / too much?
Besides that I can only think of using 'plain' jquery or similar frameworks, which is more or less what you do currently.
I would recommend trying the flask/angular combination. A simple app (few API endpoints for login and out and a few checks) and a basic website with dynamic content is setup pretty quickly.
To update page data without delay you need to use websockets.
There is no need in using heavy frameworks.
Once page is loaded first time you open websocket with js and listen to it.
Every time you read a tag you post all necessary data to this open socket and it instantly appear on client side.

Store content offline until connection is established

I am hoping for some help regarding an offline iPad application.
I have a form within the app that the user fills in, this form then links to a PHP script online. Obviously you can't run the script until you are on line. Is there any way at all of clicking the form submit button, if there is a connection it will connect to and run the PHP and if there is no connection it will automatically run the php in the background when a connection becomes available.
I have tried a number of different searches but have still been unsuccessful.
Thank you in advance!
It most likely is possible to solve this problem with JavaScript, but that's not so straightforward. Since you are dealing with an iOS app where it is possible to check network connection status and listen for changes, you probably should create a service that receives the form data within your app. That service should store the data locally, find out when your target server is accessible and send it.
UPDATE:
If you are dealing with a web-app, the way to go for it still to implement a service in JavaScript that uses timed events (i.e. setTimeout() or setInterval()) to check connection status. Upon submitting the form, prevent the default behaviour so the form is not submitted traditionally. Instead, store the data locally in sessionStorage or localStorage and when your service finds the target server available, read the locally stored data and send it via AJAX.

Javascript Best Practise: Syncing Browser Windows

I have an html5/javascript application in which multiple users can be viewing the same set of data of any given time. For the sake of a real world example, lets say its a calendar type page.
So user1 is looking has the browser open and looking at the calendar page and user2 is also on the calendar page. User2 makes a change to the calendar and i'd like (as quickly as possible) for those changes the be recognized and refreshed on user1's screen. What is the best way to do this?
I'm thinking about have a mysql table for active users that stores the page they are currently on and a timestamp for its last update, then use ajax calls to ping the server every few seconds and check for an updated timestamp, if its newer than what they have client side, the new data gets sent and the page "reloaded." I am putting reloaded in quotes because the actual browser window will not be refreshed, but a function will be called via javascript that will reload the page. Sort of the way stack overflow performs its update checks, but instead of telling the user the page has changed and providing a button for reload, it should happen automatically. If user1 is working away on the calendar, it seems it might be quite annoying for user2's screen to constantly be refreshing...
Is this a horrible idea? Is pinging the server with an ajax request every few seconds going to cause major slow downs? Is there a better way to do this? I would like the views on either users side to be real time because its important that user1 not be able to update an element on the calendar page that user2 has already changed.
Update: based on some web sockets research it doesnt seem like a proper solution. First its not compatible with older browsers and i support ie8+ and second i dont need real time updstes for all users on the site. The site is an account based applicatiin and an account can have multiple users. The data needs to sync between those users only. Any other recommendations would be great.
You need realtime app for this. You should have a look at socketio. Everytime a user log in, you make him listen for changes on the server. Then when something changed on the server, every users listening are notified.
you can find examples on the official website : http://socket.io/

How can I scrape an ASP.NET site that does all interaction as postbacks?

Using Python, I built a scraper for an ASP.NET site (specifically a Jenzabar course searching portlet) that would create a new session, load the first search page, then simulate a search by posting back the required fields. However, something changed, and I can't figure out what, and now I get HTTP 500 responses to everything. There are no new fields in the browser's POST data that I can see.
I would ideally like to figure out how to fix my own scraper, but that is probably difficult to ask about on StackOverflow without including a ton of specific context, so I was wondering if there was a way to treat the page as a black box and just fire click events on the postback links I want, then get the HTML of the result.
I saw some answers on here about scraping with JavaScript, but they mostly seem to focus on waiting for javascript to load and then returning a normalized representation of the page. I want to simulate the browser actually clicking on the links and following the same path to execute the request.
Without knowing any specifics, my hunch is that you are using a hardcoded session id and the web server's app domain recycled and created new encryption/decryption keys, rendering your hardcoded session id (which was encrypted by the old keys) useless.
You could try using Firebugs NET tab to monitor all requests, browse around manually and then diff the requests that you generate with ones that your screen scraper is generating.
If you are just trying to simulate load, you might want to check out something like selenium, which runs through a browser and handles postbacks like a browser does.

Categories

Resources