I have a function to call a PHP script using Ajax, I would to add another event to call the same PHP page, how can I add it instead of repeating the same Ajax call?
$('.episodeNum').change(function(){
var formItems = $('form.addMedia').serialize();
var dataString = formItems;
$.ajax({
type: "POST",
url: "grabMedia.php",
data: dataString,
dataType: "json",
success: function(data) {
I would to add a click function to call the same script:
$('.clickButton').click(function(){
var formItems = $('form.addMedia').serialize();
var dataString = formItems;
$.ajax({
type: "POST",
url: "grabMedia.php",
data: dataString,
dataType: "json",
success: function(data) {
How can I combine both of them??
Thanks for your usual help
A function of the code can be made and it can be called on both the events:
function post_data()
{
var formItems = $('form.addMedia').serialize();
var dataString = formItems;
$.ajax({
type: "POST",
url: "grabMedia.php",
data: dataString,
dataType: "json",
success: function(data) { }
}
$('.episodeNum').change(function(){
post_data();
});
$('.clickButton').click(function(){
post_data();
});
Does this suit your need?
var post_data = function()
{
var formItems = $('form.addMedia').serialize();
var dataString = formItems;
$.ajax({
type: "POST",
url: "grabMedia.php",
data: dataString,
dataType: "json",
success: function(data) { }
};
$('.episodeNum').change(post_data);
$('.clickButton').click(post_data);
Related
I am trying to pass json data after successfully received the array, but what i am trying to pass to modal window to edit the values. data is array actually have the values but not passing to the html form.
function passvalue(val,start,end)
{
var id=val;
var start=start;
var end =end;
//var dataString = "id=" + id;
$.ajax ({
type: "POST",
url: "get-results.php",
data: {id:id},
// dataType: 'json',
success: function(data)
{
//console.log(data);
$('#ctemail').val(data.cemail);
}
});
}
And my html is:
Enter Customer Email
I corrected some shortcomings.
function passvalue(val,start,end)
{
var id=val;
var start=start;
var end =end;
//var dataString = "id=" + id;
$.ajax ({
type: "POST",
url: "get-results.php",
data: 'id='+id, // multiple: data: 'id='+id+'&id2='id2,
// dataType: 'json',
success: function(json_data)
{
var data = JSON.parse(json_data); // Json parse
//console.log(data);
$('#ctemail').val(data.cemail);
}
});
}
I have code in my html file as below. I am using jQuery Mobile
$.ajax({
type: "GET",
url: "http://localhost/owner_pickup.php",
cache: false,
dataType:'json'
success: function(data)
{
// On success
}
});
owner_pickup.php returns me data by executing query. Now i need to pass a value which i would read in my owner_pickup.php file.
Kindly suggest me how would we pass the value
in your php file:
$value = array(
"dat_1" => "this is data number 1",
"dat_2" => "this is data number 2"
);
echo json_encode($value);
in your jquery finction:
$.ajax({
type: "GET",
url: "http://localhost/owner_pickup.php",
cache: false,
dataType:'json'
success: function(data)
{
var value1 = data.dat_1;
var value2 = data.dat_2;
}
});
please look at this answers:
retrieve multiple values from ajax call
if you don't know how to use JSON please google it.
edit:
pass a value to the php:
$.ajax({
type: "GET",
url: "http://localhost/owner_pickup.php",
cache: false,
data: {
first_value:50,
second_value:55
}
dataType:'json'
success: function(data)
{
var value1 = data.dat_1;
var value2 = data.dat_2;
}
});
in the php:
if(isset($_GET['first_value']))
$first = $_GET['first_value'];
$.ajax({
type: "GET",
url: "http://localhost/owner_pickup.php",
data: {param1: 123, param2: "text value"},
cache: false,
dataType:'json',
success: function(data) { // On success }
});
$.ajax({
type: "GET",
url: "http://localhost/owner_pickup.php",
data:{key1:value1}
cache: false,
dataType:'json'
success: function(data)
{
}
});
In php aaccept it as
<?php
$_REQUEST['key1'];
?>
why isn't this working?
jQuery AJAX Code:
$("header input").bind("keyup", function()
{
var searchString= $("header input").val();
var dataString = 'search=' + searchString;
alert(dataString);
$.ajax({
type: "POST",
url: "index.php",
data: dataString,
cache: false
});
});
PHP Code(Just a test Code):
if($_POST["search"]) {
echo "TEST MESSAGE!";
}
It doesn't show The echo :/
thanks for ur help ;)
You need to display the data you receive from the ajax call.
Example, to put the result into a <div> called YourresultDiv:
Try with this
$("header input").on("keyup", function () {
var searchString = $("header input").val();
var dataString = 'search=' + searchString;
alert(dataString);
$.ajax({
type: "POST",
url: "index.php",
data: dataString,
cache: false,
success: function (data) {
$('#YourresultDiv').html(data);
alert("Successful");
}
});
});
Hopes this will help you....
$("header input").bind("keyup", function()
{
var searchString= $("header input").val();
var dataString = 'search=' + searchString;
alert(dataString);
$.ajax({
type: "POST",
url: "index.php",
data: dataString,
cache: false,
async: false
},success: function (data) {
$('div#posteddata').append(data);
}
);
});
<html>
<head>
</head>
<body>
<div id="posteddata"></div>
</body>
</html>
You need to specify an element you want to update.. for example
<div id="result"> </div>
and then append a success event handler to your ajax call
$("header input").bind("keyup", function () {
var searchString = $("header input").val();
var dataString = 'search=' + searchString;
alert(dataString);
$.ajax({
type: "POST",
url: "index.php",
data: dataString,
cache: false
}).success(function (data) {
$("#result").html(data);
}).fail(function () {
alert("Ajax failed!");
});
});
Try with this
In js add
success: function (data) {
// success handler
}
as your response handler
if($_POST["data"]) {
// search = search string available here in $_POST['data']
echo "TEST MESSAGE!";
}
where is your call back function in $.ajax() function,with callback function only,you can display anything through an ajax request..
So try this.
$("header input").on("keyup", function () {
var searchString = $("header input").val();
var dataString = 'search=' + searchString;
alert(dataString);
$.ajax({
type: "POST",
url: "index.php",
data: dataString,
cache: false,
success: function (data) {
$('#Yourdiv').html(data); // or $('#Yourdiv')text(data);
}
});
});
Without success function,you can see the echoed statement in your network segment in console.
for that, press F12,then you will get a link like
XHR finished loading: POST "http://localhost/yourproject/func_name.Click on that link and you will goto network segment and from there,click on the function name and then in response or preview tab,you canb see the echoed statement..
try it.
I Use this code for paging
function changePagination(pageId,liId,modul,userid){
$(".flash").show();
var dataModul = 'modul='+modul;
var dataUser = 'userid='+userid;
var dataString = 'pageId='+ pageId;
$.ajax({
type: "POST",
url: "loadDataVerifikasi.php",
data: dataString,
data: dataModul,
data: dataUser,
cache: false,
success: function(result){
$(".flash").hide();
$(".link a").removeClass("In-active current") ;
$("#"+liId+" a").addClass( "In-active current" );
$("#pageData").html(result);
}
});}
And this for an action file with name loadDataVerifikasi.php
if(isset($_POST['pageId']) && !empty($_POST['pageId'])){
$id=$_POST['pageId'];
}
else{
$id='0';
}
$pageLimit=PAGE_PER_NO*$id;
$query="select * from pengajuan_".$_POST['modul']." join verifikasi on pengajuan_".$_POST['modul'].".ketkdpengajuan = verifikasi.ketkdpengajuan where kdadmin = '".$_POST['userid']."' group by kdverifikasi limit $pageLimit,".PAGE_PER_NO;
But $_POST['modul'] post nothing,
I am not familiar with your syntax.
Please try:
function changePagination(pageId,liId,modul,userid){
$(".flash").show();
var datastring = {
modul: modul,
userid: userid,
pageId: pageId
}
$.ajax({
type: "POST",
url: "loadDataVerifikasi.php",
data: dataString,
cache: false,
success: function(result){
$(".flash").hide();
$(".link a").removeClass("In-active current") ;
$("#"+liId+" a").addClass( "In-active current" );
$("#pageData").html(result);
}
});
}
The $.ajax data attribute accepts an object with key-value pairs
I believe it is because you overwrite the data with dataUser.
I haven't tested i but the code below should work.
Also check out this for more info
function changePagination(pageId,liId,modul,userid){
$(".flash").show();
var dataModul = 'modul='+modul;
var dataUser = 'userid='+userid;
var dataString = 'pageId='+ pageId;
$.ajax({
type: "POST",
url: "loadDataVerifikasi.php",
data: { 'dataString':dataString, 'dataModul':dataModul, 'dataUser':dataUser },
cache: false,
success: function(result){
$(".flash").hide();
$(".link a").removeClass("In-active current") ;
$("#"+liId+" a").addClass( "In-active current" );
$("#pageData").html(result);
I am new to ajax and CI .I want to send data and image through ajax . In my view i have 3 input fields and one image upload button .
var val1 = $("#val1"+id).val();
var val2 = $("#val2").val();
$.ajax({
type: "POST",
url: "page/save_data",
data: "{ val1 :'"+val1+"',val2:'"+val2+"}",
success: function(msg) {
alert(msg);
}
});
and in controller when i try this it shows me nothing
function save_data()
{
$val = $this->input->post('val1');
echo $val1;
}
In console it gives me nothing .
Try this :
$.ajax({
type: "POST",
url: "page/save_data",
data: { "val1 ":val1,"val2": val2},
success: function(msg) {
alert(msg);
}
});
Your ajax URL must be refer to your method name;
...
$.ajax({
type: "POST",
url: "page/save_data", //change this to your method;
...
should be like:
...
$.ajax({
type: "POST",
url: "page/save_iudata",//or whatever your method's name;
...
EDIT:
try this way:
function save_data(){
$val1 = $_REQUEST['val1'];
echo $val1;
}
Hello to send data via ajax is easy:
var data = {
val1: $('#val1').val(),
val2: $('#val2').val(),
};
$.ajax({
url: "<?php echo base_url().'page/save_data'; ?>",
dataType: 'json',
type: 'POST',
async : false,
data: data,
success: function(msg){
...
}
});
return false;
But to send an image you have to do some research...
here is a good tutorial