I’m facing a situation with Ajax request on back button.
I created a form which posts values and returns results via ajax request according the given filters and loads on a specific div. When I click on any of the link on page, it opens the new url as expected. On clicking on browser back button it opens the previous form page with default values. How can I enable browser state functionality so that I have results with last posted values with browser back button. Note that type of ajax is POST.
One solution I got is that to modify this form type to GET instead of POST, but this would take much time to do changes in server side code.
var page_url = $(this).attr('href');
page_url = page_url.split(':');
var page = page_url['1'];
$form = $('#form);
$.ajax({
type: 'POST',
data: $form.serialize(),
url: webroot + 'controller /action/page:'+page
}).done(function (result){
})
I want to know the possible solution.
You should set cache to false:
$.ajax({
dataType: "json",
url: url,
cache: false,
success: function (json) {...}
});
Source https://stackoverflow.com/a/25230377
you can use Jquery .unload() function or try cookies you could read it from here How do I set/unset cookie with jQuery?
Once you submitting that time dont go for new page, just hide the form elements and display new content in other div. Once you click on back button just show previously hidden div and hide current showing div
Related
If ajax call ok than a href not working or if i stop ajax call than href ok, But i want both work on click
View
Ajax Request
$("body").on("click", ".btnad", function(e){
e.preventDefault();
details_id = $(this).attr('id');
$.ajax({
url: 'assets/php/process.php',
type: 'post',
data: { details_id: details_id },
success:function(response){
data = JSON.parse(response);
$("#getID").text(data.id);
$("#getTitle").text(data.ad_title);
$("#getUser_coin").text(data.user_coin);
}
});
});
If I understand correctly, you want to initiate an AJAX request and follow the link. You can't reliably do both an an asynchronous thing (ie an AJAX request) and still allow the browser to follow a link to a new page.
Instead, you should drop your use of AJAX, and instead allow your browser to perform a normal request to assets/php/process.php, but hae that page redirect the browser to the page you want to show next.
I wonder tho, how can I embed an http request url like myurl.php in an html form and then push the values onto the server using buttons
So I want to put (url.php), but I don't want the page to redirect to the url
Each time I press submit. I just want the data to get to the specified server.
And no I do not own the website in question.
You can do this by ajax use this sample code
$("formId").submit(function(e){
e.preventDefault();
$.ajax({
type: "POST",
url: 'url.php',
data: $("#formId").serialize(), // serializes the form's elements.
success: function(data)
{
alert(data); // show response from the php script.
}
})
});
or you can use Ajax Form plugin
I am trying to get a div to reload once a checkbox has been selected or unselected and the form has been submitted. I have used AJAX and can get the form to submit on change, which works no problem. However the page has to reload to display new data.
I have built the php in such a way that it doesn't need to refresh the page or fetch a new page. If the div and it's content refreshes that should be sufficient to display the new filtered data.
Below is what I have written so far
$(document).ready(function() {
$("input:checkbox").change( function() {
$.ajax({
type: "POST",
url: "index.php?action=resortFilter",
data: $("#locationFilter").serialize(),
success: function(data) {
$('.resorts').html(data);
}
});
})
});
What do I need to do to get the div to reload after the request has been made?
I use class methods to handle the processing which return only the array of data. The requests are made to the class from a php function.
What I'm trying to do isn't actually possible to because PHP is a server side language. The best bet is to create a new intermediate file that can handle the display of the data so that it can be brought in through a normal AJAX request and get the new display from it
Where is the Ajax request? You are submitting your form through HTML/Browser. You need to use the following code:
$(document).ready(function() {
$("input:checkbox").change( function() {
var url = "path/to/your/script.php"; // the script where you handle the form input.
$.ajax({
type: "POST",
url: url,
data: $("#locationFilter").serialize(), // serializes the form's elements.
success: function(data)
{
$('.resorts').html(data);
}
});
})
});
Source: jQuery AJAX submit form
this sample loading code maybe help you
<div id="loadhere"></div>
$('div#loadhere').load('ajaxdata.php',{datatosend:whatyouwantforexamplehelloworld});
I have a table with a bunch of products from my database table. Each product has an update button which will produce a populated form via ajax for the user to ammend any details they wish.
On submit, I want to update the database and then return back to the page I was just on showing real-time updating data. With anything else I do, I send back a view to the ajax success function and it gets displayed. Only I can't seem to do it with this. I take the action and method out of my form tag and let an ajax function handle it, but it doesn't return a view, it just displays the view only, whereas I want my div to go into a specific div on the existing page
/***** submit update form *****/
$(document).on('click', '#updateSubmit', function() {
$.ajax({
type: "POST",
url: 'products/updateProduct',
success: function(data) {
$('#viewProducts').fadeIn(1000, function(){
$(this).html(data);
// THIS IS WHERE I WANT MY VIEW TO BE RETURNED TO(the #viewProducts). CAN THAT BE DONE?
})
} // end success
}); // end ajax
}); // end submit event
Try to use
url: '/products/updateProduct' in place of url: 'products/updateProduct'
if still not works try to use full path in place of relative path............
I currently have a jQuery/ajax request which produces a recordset which appears in #contentDiv on my page. The user can then browse the results and view further details of an item. Once on the page for the item it the user hits back on their browser they return to the default page for my search without their generated search results.
The current jQuery code is:
$j.ajax({
type: 'POST',
url: '/availability/search',
dataType: 'html',
data: data,
success: function(data) {
$j('#col2AvailabilityContent').html(data);
}
});
Is it possible to pass the content of the results generated and passed to #colAvailabilityContent to a cache and draw these out when the back button is used.
Thanks
Yes. The trick is to change your hash location.
For example, let's say your site is http://simnom.com/index.php.
Once your results appear, change your URL to simnom.com/index.php#x, then to index.php#results
Then, when the user hits back button, it will just go to index.php#x.
You can use the javascript:
if(location.hash == '#x') {
$("#col2Availability").html(availabilitycontent);
}
And then keep $j.ajax()'s "data" stored as a global var "availabilitycontent".