Ajax Post and CodeIgniter not working - php

I am trying to echo back code I received from Ajax. But it does not work when I am using contentType:false, processData:false.
Here is my ajax. The url is correct. If I comment out the line with post_data['file'] and contentType:false, processData:false I will be able to get the echo, but as soon as contentType:false, processData:false is in I cannot get anything.
post_data = {};
post_data['file']= document.getElementById('fileToUpload').files[0];
post_data['paper-type']=$("#paper-input :selected").val();
$.ajax({
url:'/admin/upload_paper',
data: post_data,
type: 'post',
contentType: false,
processData: false,
success: function(data){
console.log(data);
},
error: function(data){
console.log(data+"error");
}
});
Here is the code snippet from CI
public function upload_paper(){
echo $this->input->post('paper-type');
echo "testing";
echo "testing2";
}
Does anyone know what that is? Thank you.

instead of doing this:
post_data['paper-type']=$("#paper-input :selected").val();
try
var val = $("#paper-input :selected").val();
and in ajax:
$.ajax({
url:'/admin/upload_paper',
data: {'paper-type':val},
type: 'post',
success: function(data){
console.log(data);
},
error: function(data){
console.log(data+"error");
}
});

Related

AJAX send data to PHP file

send $username php with data: new FormData(this), to add.php like data: new FormData(this),$username how can i do it with ajax code
<script type="text/javascript">
$(document).ready(function (e) {
$("#uploadFormuserimg").on('submit',(function(e) {
e.preventDefault();
$.ajax({
url: "add.php",
type: "POST",
data: new FormData(this),
contentType: false,
cache: false,
processData:false,
success: function(data)
{
$("#user_img_a").html(data);
},
error: function()
{ alert("error");
}
});
}));
});
</script>
var myData = new FormData(this);
myData.append('username','<?php echo $username; ?>');
and get on "add.php" like this
$username = $_POST['username'];
This worked on my side.
Based on comments to the question, specifically:
I just want to add some data
Are you just asking how to add more fields to the object that was created already in the data value? Something like this:
var myData = new FormData(this);
myData.append("anotherField", "anotherValue");
// etc.
Then just use that variable as your AJAX data:
$.ajax({
url: "add.php",
type: "POST",
data: myData,
contentType: false,
cache: false,
processData:false,
success: function(data)
{
$("#user_img_a").html(data);
},
error: function()
{ alert("error");
}
});
You can store anything you like in a variable and use that variable at a later time. With a FormData object you would generally use .append() to add more key/value pairs to it.

how to convert $.post form to $.ajax form?

I am noob at using jquery and ajax. I need to change the form from $.post to $.ajax .
var disqus_config = function() {
this.callbacks.onNewComment = [function(comment) {
$.post("sendnotification", { comment: comment.id, post: $post->id,author:$author->id}, function(result){
alert(result);
});
}];
};
I know I need to end something like here but I am stuck how to use post datas(comment,post,author) inside this function
$.ajax({
url: 'sendnotification',
type: 'POST',
data: 'query=' + query ,
dataType: 'JSON',
async: true,
success: function(data){
process(data)
}
Thanks
Just use the same object literal you did for $.post, eg (gotta assume that's some PHP or something in there)
$.ajax({
url: 'sendnotification',
type: 'POST',
data: { comment: comment.id, post: {$post->id}, author: {$author->id} },
dataType: 'json',
async: true,
success: function(data){
process(data)
}
});
I believe dataType: 'JSON' should be changed to dataType: 'json'
Also, use the same data array as you used in your $.post variant.
$.ajax({
url: 'sendnotification',
type: 'POST',
data: { comment: comment.id, post: $post->id,author:$author->id } ,
dataType: 'json',
async: true,
success: function(data){
process(data)
}
});

ajax link json datatype call

I want to send the data via ajax to other page. I have isolated the problem. This is the code.
Thank you all for your help..But no effect..
updated code
It worked...
<script>
$(document).ready(function(){
$(".edit").click(function(event) {
event.preventDefault(); //<--- to prevent the default behaviour
var box = 1233;
var size=123;
var itemname=123;
var potency=123;
var quantity=12333;
var dataString ={
'box' :box,
'size':size ,
'itemname':itemname,
'potency':potency,
'quantity':quantity
};
$.ajax({
url: "dd.php",
type: "post",
data: dataString,
success: function(data) {
alert(data);
},
error: function(data) {
alert(data);
}
});
});
});
</script>
So I click the link,it navigates, to dd.php which has
<?php
echo json_encode(array('itemcode'=>$_POST['itemname']));
echo $_POST['itemname'];
?>
I get Object Object as alert. What am doing wrong? Pls throw some light here..thanks you..
$(document).ready(function(){
$(".edit").click(function(event) {
event.preventDefault();
var data = {"box":1233,
"size":565,
"itemname":565,
"potency":876,
"quantity":234};
$.ajax({
url: "dd.php",
type: "post",
data: data,
dataType: "json",
success: function(data) {
if(console){
console.log(data);
}
},
error: function(data) {
if(console){
console.log(data);
}
}
});
});
});
few things to consider... you can post data as object..which is clean and easier to use
$(".edit").click(function(event) {
event.preventDefault(); //<--- to prevent the default behaviour
var box = 1233;
....
var dataString ={'box':box,'size':size,'itemname':itemname,'potency':potency,'quantity':quantity};
$.ajax({
url: "dd.php",
type: "post",
data: dataString,
dataType: "json", //<--- here this means the response is expected as JSON from the server
success: function(data) {
alert(data.itemcode); //<--here alert itemcode
},
error: function(data) {
alert(data);
}
});
so you need to send the response as json in PHP
<?php
echo json_encode(array('itemcode'=>$_POST['itemname']))
?>
Here you are using querystring as sent in GET request.
If you want to send the data in same form, you can use this with GET request type:
$.ajax({
url: "dd.php"+dataString,
type: "get",
dataType: "json",
success: function(data) {
console.log(data);
alert(data.itemcode);
},
error: function(data) {
alert(data);
}
});
Or for POST request,you will have to put data in json object form, So you can use :
var dataString ={
'box' :box,
'size':size ,
'itemname':itemname,
'potency':potency,
'quantity':quantity
};
$.ajax({
url: "dd.php",
type: "post",
data: dataString,
dataType: "json",
success: function(data) {
console.log(data);
alert(data.itemcode);
},
error: function(data) {
alert(data);
}
});
});
And put echo in your php code :
<?php
echo json_encode(array('itemcode'=>$_POST['itemname']))
?>
Javascript alert shows [Object object] for object. You can see response using console.log or can use that key with alert.
For more information, refer jQuery.ajax()

jQuery Ajax posting not working

My jQuery ajax posting is not working. Here is the javascript
function SocialButtons() {
var $buttonWrapper = jQuery('.WrapperDiv');
if ($buttonWrapper.length){
var postData = $buttonWrapper.html();
jQuery.ajax({
type: 'POST',
url: 'http://www.wordpress-site.com/wp-contents/themes/theme-name/post.php',
data: postData,
cache: false,
success: function(data) {
console.log(data);
},
contentType: "application/json",
dataType: 'json'
});
}
}
I am saving the data to be posted inside a hidden div like
<div class='WrapperDiv hidden'>{"post_id":392,"url":"http:\/\/www.wordpress-site\/post\/post-title\/","title":"SEO Friendly title"}</div>
All I am getting in return from the post.php page is an empty array. Here is my code for post.php
<?php
if(isset($_POST)){
print_r($_POST);
} else {
echo "0";
}
?>
Any Idea whats wrong?
EDIT : Its working after I removed
contentType: "application/json",
dataType: 'json'
What about something like this:
var postData = "data=" + encodeURCIComponent($buttonWrapper.html());
Than in PHP:
echo $_POST["data"];
Than parse it or something....
Couple of things to try,
Try to pass the data directly in to the data object first. If it
works then you can debug and see why it's not ready your hidden div.
instead of $buttonWrapper.html try $buttonWrapper.text();
function SocialButtons() {
var $buttonWrapper = jQuery('.WrapperDiv');
if ($buttonWrapper.length){
var postData = $buttonWrapper.**text**();
jQuery.ajax({
type: 'POST',
url: 'http://www.wordpress-site.com/wp-contents/themes/theme-name/post.php',
data: **{'id':1}**,
cache: false,
success: function(data) {
console.log(data);
},
contentType: "application/json",
dataType: 'json'
});
}
}
Inside your jQuery ajax call, your data is not set to $_POST variable names. Hence why nothing is showing
Try changing your function to this:
function SocialButtons() {
var buttonWrapper = jQuery('.WrapperDiv');
if (buttonWrapper.length){
var postData = buttonWrapper.html();
jQuery.ajax({
type: 'POST',
url: 'http://www.wordpress-site.com/wp-contents/themes/theme-name/post.php',
data: {postData: postData},
cache: false,
success: function(data) {
console.log(data);
},
contentType: "application/json",
dataType: 'json'
});
}
}
Then you should have a $_POST['postData'] variable on your print_r or var_dump of $_POST.
Its working after I removed
contentType: "application/json",
dataType: 'json'

How can I send a jquery var to php?

When I try to send a var with jquery, ajax php doesn't receive it, and I don't know why.
This is my script:
function showHiddenUserInfoPanel(id){
$(document).ready(function(){
$('#admin-resume').fadeToggle('slow', 'linear', function(){
$.ajax({
async: true,
type: "POST",
dataType: "html",
contentType: "application/x-www-form-urlencoded",
data: "userid="+id, // Also I tried with : data: {userid: id},
url: "user-profile.php",
success: function(){
$('#info-user').fadeToggle('slow', 'linear');
alert(id); // I receive the correct id value
}
});
});
});
And this is my user-profile.php:
<div id="activity_stats">
<h3>Viendo el perfil de <?php echo $_POST["userid"]; ?></h3>
</div>
Can anybody can help me?
Thanks :)
Is it just me or you are not using the response at all?
$.ajax({
success: function(){
$('#info-user').fadeToggle('slow', 'linear');
}
});
Your anonymous success function is ignoring all responses. I suspect your #info-user should be an empty element and you are not getting a visual feedback.
An example could be:
$.ajax({
success: function(response){
$('#info-user').html(response).fadeToggle('slow', 'linear');
}
});
Other alternative could be using .load().

Categories