I have a page with button on it. When click the button jquery start running. It calls a function using ajax. I change the js file on project and try to see whats happening in localhost but js file is still runs old version before i changed and i can see on page source old version. why i can not change the file?
$(this).click(function (e) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "test.aspx/function",
data: $(this).text(),
dataType: 'Json',
success: function (Result) {
Result = Result.d;
data = Result;
}
});
};
i want to change data but it still running as above
data: $(this).parent().text(),
If you try to reload the test.aspx/function that is ajax called, you can open the developer tools (right click on page, click on inspect).
After the developer tools have been open, click on reload and keep that click until a menu opens. There click on "Hard Reload", or even the Empty Cache and Hard Reload
Other way is to use cache of jQuery ajax call for your tests.
And one other way is to disable the page cache for test.aspx/function on code behind. For example add that on your response.
Response.Cache.SetExpires(DateTime.UtcNow.AddYears(-4));
Response.Cache.SetValidUntilExpires(false);
Related
pls help me out. i recent used ajax for my laravel pagination. Whenever i click he back button. it does not go back to the page i am coming from. it goes back to page 1. let me Illustrate this clearly.
(1) i have a list of items paginated with jquery ajax.
(2) when i visit the 5th page( for example) and click an item to view details of that item and decided to click the browser back button, i am expected to be taken back to page 5 where i was. instead, i am taken back to page 1.
(3) This is only happening in chrome related browsers. it works well in Firefox;
//BELOW IS MY AJAX CODE;
$(document).ready(function(){
$(document).on('click','.pagination a',function(e){
e.preventDefault();
var pageNumber = $(this).attr('href').split('page=')[1];
getMorePage(pageNumber)
});
function getMorePage(page) {
$.ajax({
url: "/all-products-ajax/"+"?page="+page,
type: "get",
datatype: "html"
}).done(function (data) {
$('#product-view').html(data);
}).fail(function () {
alert('Posts could not be loaded.');
});
}
});
Ajax queries are different than browsing a webpage. You may need to register new routes to browser's history.
https://developer.mozilla.org/en-US/docs/Web/API/History/pushState
You might want to check out here.
I have a problem in my current application. I load lots of page content via ajax and it works always as expected. However, every time user visits another page of my application and clicks back button, those ajax calls is sent every time. I found myself deleting all of the content before ajax call and load it after that. Is there a simple way for such a case ? I mean, I would like to know if there is a way that I can be informed as back button is clicked so I don't need to make another ajax call ?
This is html file:
<div id="contentToBeLoaded">
</div>
It's my current java script now:
$(document).ready(function(){
$("#contentToBeLoaded").empty(); // This is to the handle back button is clicked
$.ajax({
type: 'GET',
url: '/pageToLoadContent',
dataType: 'html',
success: function(html) {
$("#contentToBeLoaded").html(html);
},
error: function(error) {
console.log(error);
}
});
}
I am trying to Implement functionality with code as shown in link below, But Instead of "Next" and "Previous", I am putting "Save" and "Next". When I click on "Save" - without the page getting refreshed, I should be able to navigate to next tab by saving data to backend (Rails).
1 Method of doing it is "Ajax", But I don't know How to start with it.
CODE LINK HERE
// Code in js-fiddle
try below code to click on save button, run ajax, save data and then show next tab:
$(".save_btn").click(function(){
$.ajax({
type: "post",
url: "/path",
data: "params1=data",
success: function(){
$("#tab2").show();
}
})
})
I'm calling a PHP file, and it's returning the response when I view it in Firebug. However, it's not displaying on my page. I'm not sure if the success is actually firing, because I can't even run an alert, but it is working because the PHP code is firing and returning what it's supposed to.
<script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script>
$.ajax({
type: "GET",
url: 'https://www.example.com',
dataType: 'jsonp',
contentType: "text/html",
crossDomain:'true',
success: function (data) {
$(".result").html(data);
}
});
</script>
<div class="result"></div>
You need to make the ajax call on load or document ready. The div may not exist at the time of response (page is interpreted top down).
Just a little lesson about what your are doing.
When working with any form of Ajax (or JavaScript in general), it is usually imperative to have your console open. You will be able to see your request, your response, and whole other useful information.
I usually work with Firefox and Chrome from time to time.
You can open your console by right clicking on the page anywhere and inspect an element with Firebug (on Firefox).
And inspect element in Chrome.
Once you see the Ajax call, click the + and see its content.
You should see something like:
Headers Post Response JSON Cookies or something alike.
I hope that helps.
i am trying to be able to edit my custom cms blog posts without leaving the page.
The way it works is each post has a edit button which when clicked hides the post text, and displays a ckeditor and also a save button.
All the code works correctly behind the scenes as to say, when saved an ajax call is made to another php page which updates the posts content. Now the issue is i want to on save, show again the text and hide the editor.
I can get this working, but i cant get the div text to update to the new content until the page is refreshed.
So the ajax looks like so:
// ... goes after Validation
if (check == true) {
$.ajax({
type: "POST",
url: "process/updatepost.php",
data: $targetForm.serialize(),
dataType: "json",
success: function(response){
if (response.databaseSuccess)
$targetForm.find('.editor').toggle('hide'),
$targetForm.find('.buildtext').load('http://localhost/buildsanctuary/viewbuild.php?id=134 +bt+'),
$targetForm.find('.buildtext').toggle('show'),
$targetForm.find('.edity').toggle('show'),
$targetForm.find('.saveupdatebutton').toggle('hide');
else
$ckEditor.after('<div class="error">Something went wrong!</div>');
}
and this is how im trying to use a variable in the selector...
var bt = $(this).attr(".buildtext");
hope this all makes sense?
Craig.