Develop Reference

WP REST API Post Status Using JavaScript

I am getting my hands dirty in WP REST API. I have gone through a couple of tutorials and have a question using JavaScript to create a new post.
In this tutorial, the post var status = 'draft'; (see code). So I am just worried that won't anyone able to hack that status?
jQuery( document ).ready( function ( $ ) {
$( '#post-submission-form' ).on( 'submit', function(e) {
e.preventDefault();
var title = $( '#post-submission-title' ).val();
var excerpt = $( '#post-submission-excerpt' ).val();
var content = $( '#post-submission-content' ).val();
var status = 'draft'; // this code
var data = {
title: title,
excerpt: excerpt,
content: content
};
$.ajax({
method: "POST",
url: POST_SUBMITTER.root + 'wp/v2/posts',
data: data,
beforeSend: function ( xhr ) {
xhr.setRequestHeader( 'X-WP-Nonce', POST_SUBMITTER.nonce );
},
success : function( response ) {
console.log( response );
alert( POST_SUBMITTER.success );
},
fail : function( response ) {
console.log( response );
alert( POST_SUBMITTER.failure );
}
});
});
} );

Users can always manipulate the data being sent in javascript/jquery requests since it all lives client-side
It is not possible to ensure what data is coming from a client. This passes the burden to the server to validate each incoming request. The only way to guarantee a user doesn't submit a different value than expected would be to handle that server-side. Anything you do client side can be manipulated by anyone visiting your site.

Pulling information from another website - Javascript/jQuery

I'm currently just trying to test and find out how to pull information from cnn.com and get the some of the titles of the articles with the class name, "cd__headline-text." However, when I use the $.ajax function to get the titles of the articles on cnn with that class name I get an error that says response.getElementsByClassName is not a function.
Below is the code that prompts this error to happen:
$(document).ready(function(){
$("button").click(function(){
console.log("hi test");
$.ajax({
url: "https://www.cnn.com",
cache: false,
success: function(response){
filter = response.getElementsByClassName("cd__headline-text");
console.log(filter);
}
});
});
});
My current console.log(response); output is in this link:
https://pastebin.com/SsBSPdBL

However, when I use the $.ajax function to get the titles of the
articles on cnn with that class name I get an error that says
response.getElementsByClassName is not a function.
Because response is not a Node or DOM element.
You need to parse the XML and find the element by attribute
xmlDoc = $.parseXML( response ),
$xml = $( xmlDoc ),
and now get the required value from it
$title = $xml.find( "[class='cd__headline-text']" );
or
$title = $xml.find( ".cd__headline-text" );
Or if the value is already an HTML, then simply
$( response ).find( ".cd__headline-text" )

Try this, or check URL
$(document).ready(function(){
$("button").click(function(){
console.log("hi test");
$.ajax({
url: "https://www.cnn.com",
cache: false,
success: function(response){
$(response).find('.cd__headline-text').each(function(){
console.log($(this).html());
});
}
});
});
});
Hope this will help you.

ajax $_POST array missing

I use the jquery $.post function to post to my local server. It posts correctly and I see the value inside the $_POST array. But when I upload the same code online on a website, the $_POST returns empty. Somehow the 'name' var is not even being sent over? What am I missing?
Heres the jquery/javascript side:
$("#box").keyup(function( event ) {
//Simple test to see if it gets to the
//file.
$.post( "test-file.php", { name:"John"}, function() {
alert( "success" );
})
.done(function(data) {
//Checking the respones from the file
alert( "second success: "+data );
})
.fail(function() {
alert( "error" );
})
.always(function() {
alert( "finished" );
});
});
Heres what the test-file.php file does:
<?php
//Checking to see if I get to the
//file
echo "TEST:";
//Checking to see whats inside the post
var_dump($_POST);
?>

You need to write the url of your php page.
If it's www.my_url.com/test-file.php you need to write it like this:
$.post( "www.my_url.com/test-file.php", { name:"John"}, function() {
alert( "success" );
}) .....

It looks like you are posting JSON data to php. Make sure you double check the content-type header to be sure.
Generally speaking the $_POST variable is only populate when you post application/x-www-form-urlencoded. See if the below works for you:
$rest_json = file_get_contents("php://input");
$_POST = json_decode($rest_json, true);

how to use ajax in jQuery in javascript

I want to post javascript variable to another php file and I search using Ajax may help.I want to get back the data on another php file by "post" method.But I can't use $.ajax({}) directly inside javascript:
function input() {
$.ajax({
url : 'update_service.php',
type : 'POST',
data : {
name: name,
},
success : function(response) {
alert(response);
}
});
The error message said "unexpected function ajax()". How to fix it?

JQuery Version
$.post( "update_service.php", function( data ) {
alert( "Data Loaded: " + data );
});

Making Ajax call from javascript

I have the following jquery ajax call and it works fine in a purely jquery file.
var request = $.ajax({
url: "kscript.jsp",
type: "POST",
data: {st:start, sp:stop},
dataType: "html"
});
request.done(function(msg) {
$("#output").html( msg );
alert("Success!!!"+msg);
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
Thereafter I rewrote my code as a javascript, but I am now putting the ajax call directly inside a javascript function. This hasn't worked and I am getting 500 Internal Server Error.
function myAjax(){
var request = $.ajax({
url: "kscript.jsp",
type: "POST",
data: {st:start, sp:stop},
dataType: "html"
});
request.done(function(msg) {
$("#output").html( msg );
alert("Success!!!"+msg);
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
}
I have also tried this:
function ajaxFunction() {
xmlhttp.open("POST","kscript.jsp",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("st=start&sp=stop");
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("output").innerHTML=xmlhttp.responseText;
}
}
}
but the same error: 500 Internal Server Error. In all these instances, the error is pointing to kscript.jsp .I have ensured that the URL and spelling is correct but hasn't worked. I would appreciate your suggestion to fix this problem.
here is kscript.jsp
<%
String astart = request.getParameter("start");
String sptimes=request.getParameter("stop");
out.print("<h1> Start is: "+start+" -- Stop is"+stop +"</h1>");
%>

it's looks like a folders structure problem, you shoudl ensure that the relative path is fine, I mean, if you are calling from a js you should point to /jsp/yourJsp.jsp , checkit... by the way, are you using the F12 tools to validate the response from the server ?

i think you are making some mistake to call java script method.so check or have you describe ajaxcall inside javascript tag.

You are trying to access the wrong parameters in jsp.
The error occurs here:
String astart = request.getParameter("start");
the parameters are st and sp, not start and stop.
you need:
String astart = request.getParameter("st");
String sptimes=request.getParameter("sp");
Or, you can change the js to pass the correct parameters:
data: {start:start, stop:stop},