I have multiple text field in my form and i want to transfer the data of fields to another page using jquery but user should stay on same page. Only javascript code please.
You can use jQuery's AJAX API, allowing you to make your own HTTP requests.
$.ajax({
type: "POST",
url: url,
data: data,
success: success,
dataType: dataType
});
Assuming you are trying to process the data and transfer it, with the use of a server.
LocalStorage can also be used to store key-value sets of data on the users hard-drive. This data will only be available to your specific domain, but the is free to alter it, as it is on their computer.
You can use cookies, localStorage or sessionStorage to pass them through pages. No jquery needed.
Related
I got a URL from a ecommerce website and when i access it i get all the last 5 products that i've visited in their site. I don't know how it works, i guess it's because of the cookie that this ecommerce website have left in my browser.
I would like to use this URL to show in my website something like this: "The Last 5 Products You Have Seen at X Ecommerce Website".
But to do that this URL must be executed in somehow in the client side and i will still need to get the JSON content returned by this URL.
Is there exist anyway to do that by using PHP or any other web technology?
Thank you!
It might be cookies, localStorage (there are other APIs to save data on local computer, imo they are unused or deprecated e.g. openDatabase) or last views could be connected with account and saved on internal database.
You should use AJAX, but by default in browser mechanism called CORS blocks all requests coming from other domain than resource.
In PHP you can download external page using file_get_contents function or cURL library, but without localStorage/cookies (which can be accessed from JS executed on domain, where that cookies are saved).
AJAX is your option for client side requests. Here's the jQuery guide for it.
https://api.jquery.com/jquery.ajax/
Here's a quick example:
$.ajax({
url: "http://ecommerce.com/your/url/here",
method: 'get',
dataType: 'json', //if you're sure its returning json you can set this
success: function(data) {
//handle success json here
//be sure that you're going to receive json though, possibly could receive some other data type and you should handle appropriately
},
error: function(error) {
//handle error json here
}
});
I'm creating an object tag with jQuery to visualise a dynamic generated PDF file. In order to create it, I'm using the "data" attribute to include GET parameters in the url, so the server can identify what kind of file is needed.
$("#div").html("<object data='url?parameterX=1¶meterY=0' type='application/pdf'></object>");
in the same project, I now need to generate a pdf file with a dynamic generated picture. I'm able to do that with the html2canvas library and sending via POST the base64 value of the image, but since I need to show the file in the object tag, I'm unable to send the the base64 data as GET, and thus the browser shows the message "URL too long".
Is it possible create the Object tag with a complex parameter? I don't know if is possible send the information via POST.
Update
For now, the only way to solve this was the James Thorpe recommendation. with jquery ajax, i'm sending the base64 to the server and storing the value in a session variable.
Something like this:
$.ajax({
url: "url",
dataType: "text",
type: "POST",
data: { image: canvas.toDataURL("image/png").replace("data:image/png;base64,", "") }
}).done(function (data) {
$("#div").html("<object data='url?parameterX=1' type='application/pdf'></object>");
}
however, i don't know if this is the best solution. i'm gonna leave the question open and i will try to provide any update if i found something useful.
I've been working on a webpage that has a PHP backend to access a database and generate the basic page HTML. Once loaded, all user interaction is controlled by javascript.
To communicate back to the server I'm using the traditional post method:
jQuery.ajax({
type: 'POST',
url: ajaxurl,
data: postdata,
success: function(data) {
// PHP returns data
}
});
However, the moment I start communicating back to the server using this method, I create lag in the UI and the user experience suffers, especially if they have a slow connection. I've got the usual loading gif spinners and progress bars where appropriate, but I want the UI to be as instant as it can be.
The primary reason I'm going back to the server is to grab information from the database. I've been wondering if there are ways to remove this?
1) Download the database data and access it directly in Javascript? Completely removing to need to go to the server to retrieve data. Is this possible? Are there any libraries for this?
2) In general, are there more efficient ways to retrieve data from a server than using the post method?
Some possible solutions are to preload data where possible, turn on caching on server side if needed, optimize your queries to database, do not return whole html from POST etc.
I'm writing a small web-store, The backend is written in Flask, and I'm using jQuery to display popups, filter some inputs, etc.
There's a very simple cart, and I've ran into one question while making it.
I was thinking of storing the id's of each product selected (along with the amount) in cookies, and to generate the 'cart' part of the page via JS by accessing them.
Currently, I'm setting the cookies by POSTing an AJAX call to the server, which then updates the cookies.
Javascript:
$('#addcart_' + this_id).click(function() {
$.ajax({
type: "POST",
url: '/cart/',
data: JSON.stringify({"id": this_id, "amount": total_amt}),
contentType: "application/json; charset=UTF-8",
datatype: 'json',
async: false
});
});
And in Flask:
#app.route('/cart/', methods=["POST"])
def cart_update():
if request.method == "POST":
data = request.get_json()
# more code
return resp # response with cookies
Now, I was wondering, is there any point in actually doing that? I just need to store some data in cookies, and doing a call to Flask doesn't seem to add anything, so perhaps I could just set them via JS and live happily ever after?
Or are there some downsides?
There is absolutely no need to make a server-side call to set the selected products cookie. Updating it on the client side is much preferred, as it takes out all of the latency from the transaction.
Another thing to consider though is that your cookie will be sent along with every server-bound request. If you don't need this behavior (and you are fine with the browser support for it) you can use localStorage and only send back the selected values when the user checks out.
I am trying to use AJAX to securely submit data to a script. After collecting the below values, I am trying to somehow, transmit the collected values, securely, to process.php however, I have never done this before.
I appreciate any suggestions on how to encrypt or somehow secure the below data and submit it with ajax.
My JQuery
$('.process-button').click(function(){
var processNum = $('.process-num').val();
var month = $('.process-month').val();
var amount = $('.charge-amount').val();
$.ajax({
url: "process.php",
type: "post",
success: function(data){
alert(data);
}
});
});
Many thanks in advance!
There may be more that others can point out, but a few security concepts I can think of:
Transmit data using HTTPS. You may need to set up your server software for this. The page you post from may also need to be in HTTPS (so that it will be the same domain)
Do not include any information in the URL, like you often might in a GET request. (ie, POST "provider/patienthistory/patients/frankgumby/"). This is mostly handled by doing it as a POST request.
On PHP, do not trust off the bat that the information is coming from that Javascript call. Assume someone is sending requests from a random page on your site, with made-up data, and ensure said person cannot do anything malicious.