I am creating a mobile app, using jQuery Mobile and Ajax calls to PHP.
I have several mobile pages defined in the same php-file that lets the user filter down on location, type of item etc using listviews.
On some of my PHP pages I am using forms in panels to add new records.
Everything works fine except I can't figure out how to get back to the same page with the same selections, after I have added a record with a form POST?
In the normal selection workflow I use a Ajax call to populate the page in question with the correctly filtered data, based on the previous page, but to do that I would have to execute the jQuery Ajax function in my page when the page is created with PHP.
To do that the only way I have come up with is to use the PHP header function and submit the search parameters in the URL and then catch these when the web page is created and dynamically create some type of javascript onload event that executes the Ajax function with the parameters I have submitted, but surely there must be a better way?
Ok, so the way that I solved this in the end was to do all the form POSTS with Ajax calls, then I could reload the same page through javascript on complete, rather than trying to reload the page from PHP somehow.
Related
I am aware of using AJAX calls to refresh content inside a div using the response received, but in my case I have no response but still want to refresh the div.
My application has a table called 'Cart', on which when I click the delete button, it removes an item from the cart. I remove the item by sending an AJAX call to the Java servlet that updates the cart in an ArrayList. As I'm removing only one object, I dont have a response, but still want to update the cart with the removed item.
I have tried the following ways:
Redirect to the same page using servlet after updating cart array. This causes the page to reload.
request.getRequestDispatcher(target).forward(request, response); where target is index.jspx
Use $(..).load('index.jspx') to try and refresh the particular div, but this places the entire contents of index.jspx into the tiny div with the cart table.
An AJAX request (Asynchronous Javascript And XML) is sent to your server. You can define a callback for your AJAX request, that is, a Javascript function that is going to be executed once the request ended. You can also use promises for this purpose. Anyway, once you know how you can execute a function AFTER the request has completed, you need to decide whether you need information from the server.
If you are content with not receiving any meaningful answers from the server and are okay with assuming that the removal was successful, then you can simply remember which delete button was pressed, find the row which contains it and remove() it. In this case you do not need to send further requests to the server.
Otherwise, if you need to get further information from the server (because new items might have been created/modified/removed), then simply change your server-side in order to send back a JSON about the items to the client-side and refresh your table there.
You actually don't have to redirect the whole thing again. Instead of redirecting, just use response.getWriter().write(<Your updated Array>); inside doPost() or doGet() depending on which you are using.
This will send your updated array to your AJAX code, instead of refreshing the whole page.
I'm trying to write a simple web app that will read from a 1D barcode and insert the value to a MySQL database.
Ideally this website will access to a camera and just scan the barcodes, that are shown to it. There will be no further user interaction.
I have achieved scanning the barcodes and extracting the information in Javascript using ZXing. Now my research has shown me that you can't just insert a php inside javascript. So I must stop the infinite loop of the function and pass data to php, where it can be inserted to MySQL. However after I return from the function and update the database, I need to refresh the webpage to scan a new barcode.
The problem is here I don't want to refresh the webpage because the browser, that runs the webpage won't have any mouse/keyboard(user interaction). How can I call a javascript function infinite times without refreshing my browser?
After scaning, send data to php by ajax (try some javascript framework like jQuery or others...)
By javascript, you can refresh page in oncomplete state of ajax request without any keybord or mouse action.
I think your best chance is to take a look to javascript Ajax calls.
In client side
- The infinite loop call to a function that handles de ajax call. That ajax call should sent a GET o POST to a php page.
- You don't need to refresh the page. If you need to return some data, do it in the ajax response function.
In the server side
The .php handle the insertion of data to MySQL.
Recomendation:
Use jQuery, a javascript library: https://jquery.com/
Take a look:
Using Jquery Ajax to retrieve data from Mysql
Hi, I am doing Dynamic web project in Eclipse.
I am using jsp 2.0 and servlet 3.0
In some cases I need to transfer data to server and work on it and come back to same page, so at that time I am in jsp page So I transfer data using ajax and so it will send data without referencing page.
I make the ajax call into loop. It works successfully
$.ajaxSetup({async:false});
$.get('SaveMappingToXML',{objText:selectedTargetObjectsText[li],objVal:selectedTargetObjectsValue[li],rowSrc:mappingSourceFieldValue,rowDesti:mappingTargetFieldValue,rowSrcName:mappingSourceFieldName,rowDestiName:mappingTargetFieldName,sizeOfMapping:rows,objSize:sizeOfSelectedObj,boolVal:li,extID:externalID,refString:mappingReferences},function(res){
//alert("ajax call successfully.... :)");
});
In above example all element are passed into ajax without index are array of javaScript
so while i am pass 400 element into mappingReferences parameter ajax can't call and my web project display me error...
Above ajax call is written into jsp page so I can't debug this page...
So there is any limitation to pass number of arguments into ajax.
I am trying to print that array into <textarea> it will display whole array means java Script support 400 element in array so there are any limitation of ajax to pass multiples of elements in to one array...
If data length is a prob then you should use $.post here. Please go through to the link difference of $.post and $.get
or visit this link
Hope this will help you.
How do I get url that is hidden by javascript on external website?
ex: http://royaldesign.se/Att_Dricka.aspx
This url is constant through navigation of pages, so page content is loaded by javascript.
link location of a page:
javascript:__doPostBack('ctl00$masterContent$DataPager2$ctl00$ctl00','')
javascript:__doPostBack('ctl00$masterContent$DataPager1$ctl00$ctl01','')
javascript:__doPostBack('ctl00$masterContent$DataPager1$ctl00$ctl02','')
.....
Is there a way to analyze (manually or by PHP script) the function __doPostBack to find out about the urls?
Thx in advance
Those values are not hidden, the __doPostBack method posts back to itself. Those values passed to doPostBack represent the html ID's of the control doing the postback.
The page your looking at is written in ASP.NET also, not PHP.
You can use your browsers debug tools to see what data is being passed back to the server via javascript.
The __doPostBack javascript function is used to submit data to an asp.net page.
The first parameter to the function is the event target. This is the ClientID of the control that is being clicked.
Asp.net uses this value to raise a Click event on the server when the page gets submitted.
You can call this __doPostBack function via javascript yourself to get the same behavior as a user clicking it.
I gave some tips on "scraping" ASP.net pages on this other question: curl script just filling up the form not submitting it
The basics of simulating a POST request using CURL are discussed here: PHP + curl, HTTP POST sample code?
I would also add that if the site you are "scraping" from is owned by someone you are on friendly terms with (and not e.g. a competitor!) you may be able to save a lot of time by asking nicely for the content, or a static URL that gives you the content.
I have a link, that when a user clicks on it, it loads a different page as normal but also executes a JS function that autofills a specific text-box on that different page. Is it better practice to use Jquery or Javascript to do this? How can I do this using either one of them?
You can't do this from the source page.
It's a security feature. Imagine if you wrote a JS function that went to an online banking page and auto-filled a bank transfer using the user's current cookie. That's why you can't.
If you control the other page then the sequence you can use is:
Save data to the server;
Go to the new page with a JS redirect;
The new page is loaded from the server;
While loading th epage the data that was saved from the server is retrieved and used to populate the text box.
So it can be done from the server but only if you save it there. The only way of doing that is using Ajax.
An alternative approach is:
Instead of a JS redirect, submit the page back to the server;
The server saves whatever data it needs to;
The server sends back an HTTP redirect to the new page;
The new page uses the saved data to construct the new page with the populated text box.
At the end of the script add return false;. This will make the page run the script without redirecting the page.
Edit: (after saw your edition).
Is it better practice to use Jquery or Javascript to do this? How can I do this using either one of them?
jQuery is a javascript library, this it doesn't matter if you use plain javascript or use jquery as long as you happy with the result.
And about what you say that you successfully manipulated a page fro the redirecter page... I don't see how it possible.