I have the following code:
$.ajax({
type: 'GET',
url: 'edit_slides.php',
data: { user_id: user_id },
success: function() {
location.reload();
$('#messageContent').append('<p>success</p>');
}
});
What happens right now is that it appends and then reloads real quick so it loses the message.
Now, I could take out the reload and it will append but in order for my changes to take affect, the page needs to be reloaded.
Is there anything else I can do? I want to show a success message after reloading the page.
Thanks!
location.reload() will reload your page, which creates a new request to your server and the browser then loads the response. You could add a parameter to the query string for the message, e.g.
$.ajax({
type: 'GET',
url: 'edit_slides.php',
data: { user_id: user_id },
success: function() {
window.location = "?message=success";
}
});
Then in server side code, you could display the message if the parameter exists. In ASP.NET MVC, it would look like this:
#if(Request["message"] == "success")
{
<p>success</p>
}
If you don't have server side scripting available, you can also parse the querystring with javascript.
You can have some delay before you reload the page. Try this
$.ajax({
type: 'GET',
url: 'edit_slides.php',
data: { user_id: user_id },
success: function() {
$('#messageContent').append('<p>success</p>');
setTimeout(function(){
location.reload();
}, 500);
}
});
Send it to a location but with a hash in the url to indicate a success:
$.ajax({
type: 'GET',
url: 'edit_slides.php',
data: { user_id: user_id },
success: function() {
window.location = window.location + "#success";
}
});
Now when the page loads, check for the hash:
$(document).ready(function(){
if(window.location.hash) {
$("#messageContent").append("<p>success</p>");
}
Related
I want to sent current URL from Page1 to a php page called upload_picture.php.
I look at another question and this is an option:
On Page1
$.ajax({
type: 'POST',
url: '/uas_tools/visualization_generator/V2/Resources/PHP/upload_picture.php',
data: 'url=' + window.location.toString()
});
If using this option, on upload_picture.php, how to get the URL sent from Page1?
Your code to call the ajax will be as this.
$.ajax({
type: 'POST',
url: '/uas_tools/visualization_generator/V2/Resources/PHP/upload_picture.php',
data: { url: location.href },
success: function(response) {
// your success callback
},
error: function () {
// your error callback
}
});
And on the php page you can retrieve the data as
<?php
$page_url = $_POST['url'];
I want to make a follow/unfollow user on button click. However the current code only works until the page refreshes. If I refresh the page the follow text comes back. I want it to have unfollow when I refresh the page.
Do I need to have a Session for users in my PHP? Do I have to create a value for a button? Will it remember the click by multiple users?
<button class="user">Follow</button>
<p></p>
$(document).ready(function() {
$.ajax({
type: 'POST',
url: 'echocurrent.php',
success: function(data) {
$("p").text(data);
}
});
});
$('.user').click(function() {
var $this = $(this);
$this.toggleClass('user');
if ($this.hasClass('user')) {
//unfollows
$.ajax({
type: 'POST',
url: 'UnFollow.php',
success: function(data) {
$("p").text(data);
}
});
$this.text('Follow');
} else {
//follows
$.ajax({
type: 'POST',
url: 'follow.php',
success: function(data) {
$("p").text(data);
}
});
$this.text('UnFollow');
}
});
UPDATE :
I want to add this jquery to every user with a session in PHP.
How can I do that?
I'm assuming you're updating a value in "UnFollow.php" you should return this value in "echocurrent.php" and based on it show/hide the class "user"
Update:
add logic to in "echocurrent.php" to return both the number of followers and if the current user is following this user
$.ajax({
type: 'POST',
url: 'echocurrent.php',
success: function(data) {
$("p").text(data.followers);
if(data.isFollowing){
$this.toggleClass('user');
}
}
});
It seems that a couple of buttons I have on my HTML page only work when there is an alert in the function of the event, or when I navigate to another page and then back to the home page. From other similar problems I've read about, it seems as though the home page is attempting to finish some task and that the alert is buying it more time. However, I am not sure that is true in my case.
I have a Javascript file actions.js that is loaded by the HTML page in the header as a source. The file is as follows (only showing relevant code) :
$(document).ready(function() {
//This function only works with an alert before the Ajax call or when page is reloaded
$("button[name='delete_deck']").click(function() {
var id = this.id;
$.ajax({
url: "delete_decks.php",
type: "GET",
data: {selection:JSON.stringify(id)},
async: false,
success: function(data) {
location.reload();
}
});
});
//This function is for a button on the same page, but works fine without the alert or reloading the page
$("#study").click(function() {
var selection = getDeckSelections();
if(selection.length > 0) {
//Get the selected side of the card
var selected_side = $('input[name=side_selection]:checked', '#side_selection_form').val();
//Store the selected side in session storage
sessionStorage.setItem("selected_side", selected_side);
//Ajax call to get cards from database
$.ajax({
url: "get_cards.php",
type: "GET",
data: {selection:JSON.stringify(selection)},
cache: false,
async: false,
success: function(data) {
json = JSON.parse(data);
//Store the cards in session storage
sessionStorage.setItem("cards", JSON.stringify(json));
}
});
}
});
}
$(document).on('click',"button[name='delete_deck']",function() {
var id = this.id;
$.ajax({
url: "delete_decks.php",
type: "GET",
data: {selection:JSON.stringify(id)},
async: false,
success: function(data) {
location.reload();
}
});
});
I have an eventlistener that needs to run, once its run I need to redirect to another page. However when I add a window.location.href anywhere in my code it just jumps straight to the redirect and doesn't do the other code.
When I comment out the redirect it runs it...
document.getElementById('save').addEventListener('click', function () {
/*
* since the stage toDataURL() method is asynchronous, we need
* to provide a callback
*/
stage.toDataURL({
callback: function (dataUrl) {
//window.open(dataUrl);
// Send the screenshot to PHP to save it on the server
var url = 'export.php';
//alert(url);
$.ajax({
type: "POST",
url: url,
dataType: 'text',
data: {
base64data: dataUrl,
yname: thename,
yemail: theemail,
company: thecomp,
twitter: thetwitter
}
});
}
});
}); //close listener
I believe in this case you need to add a success method to your last ajax call before running the redirect.
$.ajax({
type: "POST",
url: url,
dataType: 'text',
data: {
base64data: dataUrl,
yname: thename,
yemail: theemail,
company: thecomp,
twitter: thetwitter
},
success: function() {
location.href = 'your_url';
}
});
Hello I want to post link value e.g.
href="?id=1" my link
but without refreshing the page current it refreshes the page but i dont want reloading of the page, here is my code please help me
function loadTabContent(tabUrl){
$("#preloader").show();
jQuery.ajax({
type: post,
url: tabUrl,
data: "id="+country_id,
cache: false,
success: function(message) {
jQuery("#tabcontent").empty().append(message);
$("#preloader").hide();
}
});
}
jQuery(document).ready(function(){
$("#preloader").hide();
jQuery("[id^=tab]").click(function(){
// get tab id and tab url
tabId = $(this).attr("id");
tabUrl = jQuery("#"+tabId).attr("href");
jQuery("[id^=tab]").removeClass("current");
jQuery("#"+tabId).addClass("current");
// load tab content
loadTabContent(tabUrl);
return false;
});
});
Try this :
function loadTabContent(tabUrl){
$("#preloader").show();
jQuery.ajax({
type: post,
url: tabUrl,
data: "id="+country_id,
cache: false,
success: function(message) {
jQuery("#tabcontent").empty().append(message);
$("#preloader").hide();
}
});
}
jQuery(document).ready(function(){
$("#preloader").hide();
jQuery("[id^=tab]").click(function(e){
// get tab id and tab url
tabId = $(this).attr("id");
tabUrl = jQuery("#"+tabId).attr("href");
jQuery("[id^=tab]").removeClass("current");
jQuery("#"+tabId).addClass("current");
// load tab content
loadTabContent(tabUrl);
e.preventDefault();
});
});
I think return false should be fine unless your function is causing an exception to occur such as a bad ajax request. Try putting quotes around the word post in the type attribute when you make the ajax call. Also country_id is undefined, you should pass that too if you need it.
http://api.jquery.com/jquery.ajax/
function loadTabContent(tabUrl, country_id){
$("#preloader").show();
jQuery.ajax({
type: 'POST',
url: tabUrl,
data: "id="+country_id,
cache: false,
success: function(message) {
jQuery("#tabcontent").empty().append(message);
$("#preloader").hide();
}
});
}