JavaScript AJAX passing mutltiple variables confusion - javascript

Hi all I have a AJAX query which I am calling using an onclick function as seen below, the query successfully POSTs the data from the form I have on my page - and I can use the data on my php script without an issue:
function tempFunction(obj){
var no= $(obj).attr('id');
$.ajax({
type: "POST",
url: "/tempproject/main/changepage",
data: $('form').serialize(),
success: function(msg){
alert( "success: " + msg ); //Anything you want
}
});
window.alert(no);
}
However I wish to also send the variable no along with the form data, I am a complete newbie when it comes to JS so could someone point me in the right direction of how to send the variable along with the serialized form data? can I append the serial data somehow? I feel this is probably really easy but I'm to new to JS

try this
function tempFunction(obj) {
var data = $('form').serializeArray();
data.push(
{
no: $(obj).attr('id')
}
);
$.ajax({
type: "POST",
url: "/tempproject/main/changepage",
data: data,
success: function (msg) {
alert("success: " + msg); //Anything you want
}
});
window.alert(no);
}

You may try to use jQuery Form plugin.
It allows ajax submitting form transparently, without worrying about serizalization.
Plugin: http://malsup.com/jquery/form/
Your code:
$('#form').ajaxSubmit({
data: { no: $(obj).attr('id') },
url: "/tempproject/main/changepage",
success: function(msg){
alert( "success: " + msg ); //Anything you want
}
});

Related

Not receiving data from ajax to php

I want to send data from javascript to another php page where I want to display it. I found that I need to use Ajax to pass the data to php so I tried myself.
My file where is the javascript:
$('#button').on('click', function () {
$.jstree.reference('#albero').select_all();
var selectedElmsIds = [];
var selectedElmsIds = $('#albero').jstree("get_selected", true);
var i = 0;
$.each(selectedElmsIds, function() {
var nomenodo = $('#albero').jstree('get_selected', true)[i].text;
//var idnodo = selectedElmsIds.push(this.id);
var livellonodo = $('#albero').jstree('get_selected', true)[i].parents.length;
//console.log("ID nodo: " + selectedElmsIds.push(this.id) + " Nome nodo: " + $('#albero').jstree('get_selected', true)[i].text);
//console.log("Livello: " + $('#albero').jstree('get_selected', true)[i].parents.length);
i++;
$.ajax({
type: "POST",
data: { 'namenodo': nomenodo,
'levelnodo': livellonodo
},
success: function(data)
{
$("#content").html(data);
}
});
});
});
I want to send the data to another php page which consists of:
<?php echo $_POST["namenodo"]; ?>
But when I try to go to the page there's no data displayed.
This is a very basic mistake I think every beginner (including me) does while posting a data using ajax to another php page.
Your ajax code is actually posting the data to lamiadownline.php (if you are using the variables correctly) but you can't get that data by simply using echo.
Ajax post method post data to your php page (lamiadownline.php) but when you want to echo the same data on the receiver page (lamiadownline.php), you are actually reloading the lamiadownline.php page again which makes the $_POST["namenodo"] value null.
Hope this will help.
First of all you won't be able to see what you have post by browsing to that page.
Secondly, is this
<?php echo $_POST["namenodo"]; ?>
in the current page?
Otherwise, specify the url
$.ajax({
url: "lamiadownline.php",
type: "POST",
data: { 'namenodo': nomenodo,
'levelnodo': livellonodo},
success: function(data) {
$("#content").html(data);
}
});
//try this
$.ajax({
type: "POST",
url:"Your_php_page.php"
data: { namenodo: nomenodo levelnodo: livellonodo},
success: function(data)
{
$("#content").html(data);
}
});

jQuery ajax POST request for log in

I am trying to write a .ajax request through a form to log in. When I submit my form, nothing happens with either the success or error functions. I notice that if I put an alert box after the .ajax call it does not work either. I would expect, that if I am just incorrectly putting the data, I would at least expect the error alert box to show up? Here is my code:
var clientType = "clienttype";
$(document).ready(function(){
$("#login-form").submit(function(e){
$.ajax({
type: "POST",
url: "myurl",
data: $(this).serialize() + "&client_type=" + clienttype,
success: function(data) {
alert("sent" + data);
},
error: function(){
alert("Did not work");
}
});
e.preventDefault();
});
});
I noticed you're already using JQuery. So perhaps use the built in post function. Example below:
Also side note: You've got a slight type in your variable: data: $(this).serialize() + "&client_type=" + clienttype, clienttype was declared with a capital T: clientType
var clientType = "clienttype";
$(document).ready(function(){
$("#login-form").submit(function(e){
e.preventDefault();
$.post("myurl",{data:$(this).serialize(),client_type:clientType},function(data){
console.log("Date returned from request:",data);
// Returns JSON Data. So data.clientType.
},'json');
});
});
If you add in a trigger to cancel the page from being submitted, it should work (return false;), take a look below.
var clientType = "clienttype";
$(document).ready(function(){
$("#login-form").submit(function(){
$.ajax({
type: "POST",
url: "myurl",
data: $(this).serialize() + "&client_type=" + clienttype,
success: function(data) {
alert("sent" + data);
},
error: function(){
alert("Did not work");
}
});
return false;
});
});

Is it possible to paste html into CKEditor (using js/jQuery)? [duplicate]

Everytime a page loads I need to load text into the CK Editor using JQuery, in order to get data from CK Editor I use
var editor_data = CKEDITOR.instances['editor1'].getData();
now is there a similar function I could use to put the data back into the editor?
I'm using ajax to set the data like this
$.ajax({
type: "POST",
url: "/inc/ajax/basic.php?menu_id="+menu_id+"&info=3",
success: function(msg){
CKEDITOR.instances['editor1'].setData(msg);
}
});
What am I doing wrong
Try this:
CKEDITOR.instances['editor1'].setData(html)
Where 'html' is a string containing content to edit.
Because its not an array then
just replace the instance like this
CKEDITOR.instances.editor1.setData(html)
var editor = CKEDITOR.instances.help_ldesc;
editor.setData('');
$.ajax({
url: urlstr, // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data:{action:"ex_form"}, // Data sent to server, a set of key/value pairs (i.e. form fields and values)
contentType: false, // The content type used when sending data to the server.
cache:false, // To unable request pages to be cached
processData:false, // To send DOMDocument or non processed data file it is set to false
success: function(data) // A function to be called if request succeeds
{
//alert(data);
var data1=data.split("~`");
$('#help_id').val(data1[0]);
$('#help_title').val(data1[1]);
$('#help_sdesc').val(data1[2]);
editor.setData(''+data1[3]);
var edata = editor.getData();
alert(edata);
}
});
Use this code its works for me and (help_ldesc) is my textarea name.
you should use data, and method for sending query string like this:
$(document).ready(function()
{
var querystring="menu_id="+menu_id+"&info=3";
$.ajax({
method: "POST",
url: "/inc/ajax/basic.php",
data:querystring,
success: function(msg)
{
CKEDITOR.instances['editor1'].setData(msg);
}
});
});
var jqxhr = $.get( "file.php", function(data) {
CKEDITOR.instances.idOftextAreaName.setData( data );
alert( "success" );
})
.done(function() {
//alert( "second success" );
})
.fail(function() {
alert( "error" );
})
.always(function() {
// alert( "finished" );
});
CKEDITOR.instances['<%=ckEditor.ClientID%>'].setData(value);
From my experience using inside a function sometimes doesn't work properly. I'll suggest to use in:
$(document).ready(function () {
...
// instance, using default configuration.
CKEDITOR.replace('editor1');
//set data
CKEDITOR.instances['editor1'].setData(data);
...
});

JS function/ajax only passing one parameter

I have searched multiple threads on here and cannot find the answer.
I have a JS function that is supposed to post 2 parameters via ajax to a php page. Here is the function:
function acceptbet(companyid, userid){
$.ajax({
type: "post",
url: "acceptbet.php",
data: "companyid="+companyid+"&userid="+userid,
success: function(msg){
alert( companyid+userid );
}
});
}
I have also tried it this way:
function acceptbet(companyid, userid){
$.ajax({
type: "post",
url: "acceptbet.php",
data: {companyid:companyid,userid:userid},
success: function(msg){
alert( companyid+userid );
}
});
}
No matter what I do, I can't get it to pass both parameters "userid" and "companyid" --- and the alert will only show the first one. I tried switching the two parameters, and still only the first one is returnd.
I apologize if I'm making a rookie mistake, but I can't figure out how to pass both parameters to acceptbet.php.
Help is greatly appreciated.
EDIT: here is the code for acceptbet.php:
$userid=$_POST['userid'];
$companyid=$_POST['companyid'];
$accepted=1;
$acceptbet = $connection->prepare("UPDATE user_bet set accepted=? where user_id=? and user_company_id=?");
$acceptbet->bind_param("iii",$accepted,$userid,$companyid);
$acceptbet->execute();
My syntax was correct all along. The comments that folks provided were VERY helpful for isolating the problem, which was in my SQL update - was expecting a record to update, but it was not - this was because my where clause was incorrect. For reference, the syntax below should always work for passing multiple parameters in "data:" over ajax:
function acceptbet(companyid, userid){
$.ajax({
type: "post",
url: "acceptbet.php",
data: {companyid:companyid,userid:userid},
success: function(msg){
alert( "success" );
}
});
}

How to connect to the Parse Javascript API? (502 error)

I am building a chatroom-type app using the Parse Javascript API. The task is to get some data from Parse, display it, add user input to the messages, and send it right back to parse.
The problem is I am not being able to see the data from parse, and receive a 502 error. I am a bit newer to javascript, so any advice on how to accomplish this, or any mistakes you may see in my code, would be fantastic. I also commented out my code the best I could. Thanks for the help.
Here is my code;
$(document).ready(function(){
delete Chat.display;
delete Chat.send;
delete Chat.fetch;
var my_messages = $('ul.messages')
//fetches data from parse
var myChat = function() {
$.ajax({
url: "https://api.parse.com/1/classes/chats",
dataType: "json",
success: console.log("Success"),
function message(a) {
my_messages.append('<ul>' + a +'</ul>'); //adds ul 'text' to messages
};
});
};
myChat(); // call mychat
$('button.send').on('click', function() { // when user clicks send
// send post to
$.ajax({
type: "POST",
url: "https://api.parse.com/1/classes/chats",
data: JSON.stringify({text: $('input.draft').val()}), // stringify the text on value input.draft
function(message){
window.location.reload(1) //refresh every 3 seconds
});
});
});
</script>
you have syntax error in both of your success functions of $.ajax calls. In the first ajax call you have places console.log, which should be inside the success callback. In the second one u haven't even added success: callback.
Try below updated code
$(document).ready(function(){
delete Chat.display;
delete Chat.send;
delete Chat.fetch;
var my_messages = $('ul.messages');
var myChat = function() {
$.ajax({
url: "https://api.parse.com/1/classes/chats",
dataType: "json",
success:function message(a) {
console.log("Success")
$.each(a,function(i,item){
my_messages.append('<ul>' + item.username +'</ul>'); //adds ul 'text' to messages
});
}
});
};
myChat(); // call mychat
$('button.send').on('click', function() { // when user clicks send
// send post to
$.ajax({
type: "POST",
url: "https://api.parse.com/1/classes/chats",
data: JSON.stringify({text: $('input.draft').val()}), // stringify the text on value input.draft
success:function(message){
window.location.reload(1) //refresh every 3 seconds
}
});
});
});

Categories