I have some line code AJAX in WordPress, I want AJAX URL don't affect into PHP action.
Code:
$(document).on('click', '.load-article', function() {
var reply_id = $(this).attr('data-reply-id');
var data_child = {
action: 'ajax_child_reply',
post_id: reply_id,
}
$.ajax({
url: ajaxurl,
data: data_child,
success: function(response) {
console.log(response);
}
});
});
add_action('wp_ajax_ajax_child_reply', 'ajax_child_reply');
function ajax_child_reply() {
$post_id = esc_attr($_POST['post_id']);
// to much code...
$data_child = array('delete_url' => '<a href="'.$delete_url.
'">Delete</a>', );
wp_send_json($data_child);
}
Now, on href deleted link after ajax success, every link have href=".../wp-admin-ajax.php/http://delete_link"
How to remove affected AJAX URL in PHP script?
Thank you.
Related
I´m trying to send the variable idValue to a class called cambio_prenda.php with the following code
function reply_click(clicked_id)
{
var idValue = clicked_id;
$.ajax({
type: "POST",
url: 'cambio_prenda.php',
data:{"cambio" :idValue},
success: function(response)
{
alert("exito");
}
});
}
This code works when i use it in the same class, but when I try to call it from the another class with this code it doesn´t work
<?php
if(isset($_POST['cambio'])){
$item = $POST['cambio'];
echo($item);
}
?>
so this is a hard one for me to try and explain. I have a razor page that when a button is clicked it calls a javascript function which makes an ajax call to a handler in the back end. The handler does some stuff and gets a id that I want to pass to another page. I am trying to use the RedirectToPage function in the back end but the screen never opens. It successfully calls the handler but when the handler does its return, nothing happens. Is there a way to do this?
Here is the javascript/ajax code that gets called from a button being clicked.
#section scripts{
<script>
// Get the account ID Data from the row selected and return that to the program.
function getIDData(el) {
var ID = $(el).closest('tr').children('td:first').text();
var iddata = {
'ID': ID
}
console.log(iddata);
return iddata;
}
// Submit the data to a function in the .cs portion of this razor page.
$('.copybtn').click(function () {
var accountid = JSON.stringify(getIDData(this));
$.ajax({
url: '/Copy_Old_Account?handler=CopyData',
beforeSend: function (xhr) {
xhr.setRequestHeader("XSRF-TOKEN",
$('input:hidden[name="__RequestVerificationToken"]').val());
},
type: 'POST',
dataType: 'json',
data: { offenderid: offenderid },
success: function (result) {
},
});
});
</script>
}
For my code behind code that I am calling from the ajax call, that's below here:
public ActionResult OnPostCopyData (string accountid)
{
// Do my other stuff here
return RedirectToPage("Account_Information", new { id = account.Account_ID });
}
Any help would be appreciated and if doesn't make sense, I can try and clear up any questions.
I think this is what you want, I did something similar in an MVC 5 project and I haven't tested it in Razor Pages yet:
This would be your method, note that you should add your Controller to the Url.Action, and I personally haven't tried passing a parameter along with the url but I image it'll work just fine
[HttpPost]
public ActionResult SubmitSomething()
{
return Json(new { redirectUrl = Url.Action("Account_Information", "YOUR_CONTROLLER_NAME", new { id = account.Account_ID }) });
}
And then this would be your Ajax request, I updated the success portion
// Submit the data to a function in the .cs portion of this razor page.
$('.copybtn').click(function () {
var accountid = JSON.stringify(getIDData(this));
$.ajax({
url: '/Copy_Old_Account?handler=CopyData',
beforeSend: function (xhr) {
xhr.setRequestHeader("XSRF-TOKEN",
$('input:hidden[name="__RequestVerificationToken"]').val());
},
type: 'POST',
dataType: 'json',
data: { offenderid: offenderid },
success: function (result) {
if (result.redirectUrl !== undefined) {
window.location.replace(result.redirectUrl);
} else {
// No redirect found, do something else
}
},
});
});
This isn't tested, so I can only hope that it works for you right now
Edit: Updated the Url.Action to use OP's view names and parameters
Redirect to page returns a 301 response, which will be in the format:
HTTP/1.1 301 Moved Permanently
Location: http://www.example.org/index.asp
To redirect after the ajax call you can redirect to the requested url by:
success: function (result) {
window.location = result.getResponseHeader('Location');
}
I have a page with buttons, that when pressed send an ajax request through jquery to a PHP script. This script runs with these variables. When this PHP script is finished I would like to send a message back to the jquery function, which then prints out this message. Currently I have:
$('button').click(function () {
nombre = $('input').val();
buttonz = $(this);
buttonz.text('Loading...');
request = $.ajax({
type: "POST",
url: 'administrator.php',
data: {
'method': buttonz.attr('id'),
'results': nombre
},
});
request.done(function (response, textStatus, jqXHR) {
buttonz.text('Finished');
});
});
Instead of 'finished' I would like to echo a varaible from my php script.
First need to check console error if you have any error then try to alert response in success section try
$('button').click(function () {
nombre = $('input').val();
buttonz = $(this);
buttonz.text('Loading...');
$.ajax({
type: "POST",
url: 'administrator.php',
data: {
'method': buttonz.attr('id'),
'results': nombre
},
success: function (data) {
buttonz.text(data);
// or use buttonz.val(data);
}
});
});
You cannot ECHO from jQuery as this is PHP and the server-side script has already been run. What you need to do is enter the text or html into an existing element.
For example..
On your page (before ajax is done) create a blank DIV with space to put the response ie...
<div id="MyAnswerHere"></div>
Then in your ajax call in the success area add the code to insert the answer. For example
$("#MyAnswerHere").html(response);
Or if just text you could use...
$("#MyAnswerHere").text(response);
So in your code..
$('button').click(function () {
nombre = $('input').val();
buttonz = $(this);
buttonz.text('Loading...');
request = $.ajax({
type: "POST",
url: 'administrator.php',
data: {
'method': buttonz.attr('id'),
'results': nombre
},
});
request.done(function (response, textStatus, jqXHR) {
$("#MyAnswerHere").text(response);
buttonz.text('Finished');
});
});
And add the div to enter the message do with the ID that we are selecting in the DOM before hand.
`<div id="MyAnswerHere"></div>`
simply put the response from ajax in your button,
buttonz.text(response);
cheers
You could try something like this, which will change your button text when the ajax has succeeded:
$('button').click(function () {
nombre = $('input').val();
buttonz = $(this);
buttonz.text('Loading...');
request = $.ajax({
type: "POST",
url: 'administrator.php',
data: {
'method': buttonz.attr('id'),
'results': nombre
},
success: function (data) {
buttonz.text(data);
}
});
});
Change buttonz.text('Finished'); to:
buttonz.text('<?php echo json_encode(utf8_encode($your_Value))?>');
So why not just to echo the variable with php??
Change buttonz.text('Finished'); to:
buttonz.text('<?php echo $your_variable;?>');
The value of the variable will be parsed by the PHP engine, it will appear in your HTML page as requested
I want to call Ajax which fetches all the comments from database.
Now how to put a check on that Ajax Script to Run, when only someone comments.
Same as the stackoverflow notifications. When we comment on question, The Notification appears without reloading page (i.e On Runtime ).
Right now I am Running the same Ajax Script after each 10 seconds again and again, when I think is a bad way .So Here is my working Ajax Code:
$(document).ready(function(){
setInterval(function(){
$.ajax({
type: "GET",
url: "ajax_files/reload_notifications.php"
}).done(function(result) {
var $notifications = $('#notification_area');
if ($notifications.length > 0) {
$notifications.html(result);
}
});
}, 10000);
});
When a comment is entered, do a similar AJAX request that will save the comment and on it's success callback, call another function which will also hit another AJAX request which fetches the comments. For e.g.
function insertComment() {
$.ajax({
type: "GET",
url: "ajax_files/insert_comment.php"
}).done(function(result) {
fetchComments();
}
});
}
function fetchComments() {
$.ajax({
type: "GET",
url: "ajax_files/reload_notifications.php"
}).done(function(result) {
var $notifications = $('#notification_area');
if ($notifications.length > 0) {
$notifications.html(result);
}
});
}
Hope this helps!
I have js function which sends ajax request to the controller and succ. return result and append that result into desired div inside partial page. Now I want to implement pagination and I'm using $("#dataList").on("click", ".pagedList a".getPage); to listen when user click on pagination links to determine which page number is clicked
var getPage = function () {
var $a = $(this);
GetTabData(a);
return false;
}
and finally I'm sending pagenumber to the next function which sends pagenumber together with activeTab variable to the controller
function GetTabData(xdata, pageNumber) {
$.ajax({
url: ('/Home/GetTabData'),
type: 'POST',
contentType: 'application/json',
dataType: 'html',
data: JSON.stringify({ activeTab: xdata, page: pageNumber }),
success: function (result) {
$("[id^='tab-'] div").remove();
var currentTab = $("#tab-" + xdata).html(result);
},
error: function () { alert("error"); }
});
}
Something is definit. wrong here cause on controller side I'm using
Request.IsAjaxRequest()
to allow only ajax request to paginate data and I'm getting Not ajax request. Once more, If I remove pagination option completly and send just activeTab everything works.
Any thoughts?
Your GetTabData function takes 2 arguments: xdata and pageNumber but when calling it you are passing only one:
var $a = $(this);
GetTabData(a);
So you probably are getting a javascript error and the return false statement is never reached.