html link value retrieve by Js ajax send to php - php

I have a html link with a value inside like this.
<a data-toggle='modal' data-id='1' href='#myModal' class='marker' title='Edit'>Link</a>
I have a Js script that trigger a php that I want to send the value data-id
<script>
$(document).on("click", ".marker", function () {
var myBookId = $(this).data('id');
$.ajax({
type: "post",
url: "update.php", //
data: myBookId,
success: function(msg) {
$("#thanks").html(msg)
},
error: function() {
alert("failure");
}
});
});
</script>
And in my php I have this
if (isset($_POST['myBookId'])) {
$emp_id = strip_tags($_POST['myBookId']);
echo $emp_id;
But something is wrong the value is not pass.

Your problem is on the params of the AJAX call. Try this way:
data: { myBookId: myBookId },

try
$('.marker')click(function(){
var myBookId = $().attr('data-id');
$.ajax({
type: "post",
url: "update.php", //
data: myBookId,
success: function(msg){
$("#thanks").html(msg)
},
error: function(){
alert("failure");
}
});
return false;
});

Related

How can I send a response in Ajax through php script

I need to send a response from the ajax to the php code. Alert msg as to be displayed when success.. I have to get entered date should be displayed in the url and response as to be sent..
<script>
$(document).ready(function() {
$('#txtdate').change(function(){
date = $(this).val();
$.ajax({
type: 'GET',
url: "http://localhost/data/check_date.php?date=" +date ,
success: function() {
alert(data);
}
});
});
});
</script>
Two error:
1:
date = $(this).val();
to
var date = $(this).val();
2:
url: "http://localhost/data/check_date.php?date=" +date ",
to
url: "http://localhost/data/check_date.php?date=" +date ,
3:
success: function() {
to
success: function(data) {
All script:
<script>
$(document).ready(function() {
$('#txtdate').change(function(){
var date = $(this).val();
$.ajax({
type: 'GET',
url: "http://localhost/data/check_date.php?date=" +date ,
success: function(data) {
alert(data);
}
});
});
});
</script>
Remove " mentioned at the end of the url because date is variable to be passed through url.
To overcome all mistakes change your whole code to
<script>
$(document).ready(function() {
$('#txtdate').change(function(){
var date = $(this).val();
$.ajax({
type: 'GET',
url: "http://localhost/data/check_date.php?date=" +date,
success: function(date) {
alert(date);
}
});
});
});
</script>
var date = $(this).val();
$.ajax({
type: 'GET',
url: "http://localhost/data/check_date.php?date=" +date ,
dataType: 'text',
success: function(data) { //add data in the function which is returned from the file
alert(data);
}
});
also try opening your network tab by clicking F12 in your browser before doing ajax request, if there's some error in your php file you can view it here in network tab, see if it helps

Ajax not passing by post method to php

Im using google chrome 65.0.3325.181 on windows 10, xampp is on to run the php. title explains the rest.
html/php:
$(document).ready(function (){
$('#sel_edificio').load('data.php');
$( ".form-control" ).change(function() {
var dato = 50;//document.getElementById("sel_edificio").value;
$.ajax({
method: "POST",
data: {'key': dato},
url: "uno.php",
success: function(status){
var asd = $('#test').load('uno.php');
//document.getElementById("NumEstudiantes").value(key);
}
});
});
});
</script>
uno.php:
<?php
echo $_POST['key'];
?>
error:
Notice: Undefined index: key in C:\xampp\htdocs\jqbd\uno.php on line 2
You are sending request two time, try this:
html/php
$(document).ready(function (){
$('#sel_edificio').load('data.php');
$( ".form-control" ).change(function() {
var dato = 50;//document.getElementById("sel_edificio").value;
$.ajax({
method: "POST",
data: {'key': dato},
url: "uno.php",
success: function(data){
$('#test').html(data);
}
});
});
});
change ajax method to type, try this
$.ajax({
type: "POST",
data: {'key': dato},
dataType: "json",
url: "uno.php",
success: function(status){
//var asd = $('#test').load('uno.php');
$('#test').load('uno.php', { key: dato });//document.getElementById("NumEstudiantes").value(key);
}
});

AJAX is not calling PHP?

Can anyone please point out exactly what I am doing wrong, I am trying to make a php call when a selected value is changed.
The code is not echoing the information from the php file.
JQUERY CODE
// Skill sort on change
$('#order_by').on('change', function() {
$.ajax({
type: "POST",
url: "sort_skill_be.php",
data: {skill:this.value}
}).done(function(result){
console.log(result)
})
});
PHP CODE
<?php
session_start();
$skill_sort = $_POST['skill'];
echo $skill_sort;
echo 'I got in here';
?>
Thank you for the help and time!
EDIT: It works correctly now, Thanks for all the help!
Try this:
$('#order_by').on('change', function() {
var sk = $(this).val();
$.ajax({
type: "POST",
url: "sort_skill_be.php",
data: 'skill=' + sk,
success: function(result) {
alert(result);
}
});
});
Try this
$('#order_by').on('change', function() {
$.ajax({
type: "POST",
url: "sort_skill_be.php",
data: {skill:$(this).val()},
success: function(result){
alert("done");
},
error: function(){
alert("error");
}
});
});
You should use then instead of done http://promises-aplus.github.io/promises-spec/
$('#order_by').on('change', function () {
$.post("sort_skill_be.php", {
skill: $(this).val()
}).then(function (result) {
console.log(result);
}).fail(function () {
console.err('failed to fetch data');
});
});
You could test things out like this...
// Skill sort on change
$('#order_by').on('change', function() {
$.ajax({
type: "POST",
url: "sort_skill_be.php",
data: {skill:this.value}
}).done(function(result){
console.log('my results' + results);
})
});

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()

Form Submition Ajax call in jquery mobile

I want to submit form throught ajax call in jquery mobile.
My script is that
<script>
function confirm(){
var user_name = $('#login_form').find('input[name="user_name"]').val();
$.ajax({
type: "POST",
url: $('#login_form').find('input[name="action"]').val(),
data: "val=" + user_name,
success: function(data){
alert(data);
}
});
}
</script>
My Form is here....
Name
Email
Password
Please it is urgent..........
function confirm(){
var frm = $('#login_form');
frm.submit(function () {
$.ajax({
type: frm.attr('method'),
url: frm.attr('action'),
data: frm.serialize(),
success: function (data) {
alert('ok');
}
error: function(xhr,err){
alert(err);
}
});
return false;
});
}
You can use this function to post your data...
You can try this function also...
$("#login_form").submit(function() {
$.ajax({
type: "POST",
url: $(this).attr('action'),
data: $("#login_form").serialize(), // serializes the form's elements.
success: function(data)
{
alert(data); // show response from the php script.
}
error:function(xhr,err){
alert(err);
}
});
return false; // avoid to execute the actual submit of the form.
});

Categories