function is callign but Ajax is not calling - ajax

Here I am using codeigniter with highchart. Highchart will change after dropdown select by calling ajax.
Here, function is called but ajax is not calling. So, where I go wrong with this.
This is my ajax:
$('.edit').click(function(e)
{
e.preventDefault();
$.ajax({
url: '<?php echo site_url("Chart/branchwiseactivity");?>',
type: 'POST',
data: {
series: []
},
dataType: 'json',
success: function(json)
{
options.xAxis.categories = json[0]['data'];
options.series[0] = json[1];
options.series[1] = json[2];
options.series[2] = json[3];
options.series[3] = json[4];
chart = new Highcharts.Chart(options);
}
});
e.preventDefault();
});

Related

How to show array result in ajax success using codeigniter?

I am fetching values from data using where in() mysql query and I got the correct result, but I don't know how to display the result in ajax success.
How do I display company name and email id from result data set?
my ajax code
<script type="text/javascript">
$('#ok').on('click', function() {
var vals = $('#show').val();
$.ajax({
type: "POST",
url: "<?php echo base_url();?>email/get_company",
data: { vals:vals },
datatype: 'json',
success: function (data) {
alert(data);
$("#result").html(data);
var result = JSON.parse(data);
}
});
});
</script>
my controller code:
function get_company()
{
$vals = $this->input->post('vals');
$query = $this->db->query("SELECT * FROM customer` where company_id IN ($vals) ")->result();
echo json_encode($query);
}
my result:
[{"company_name":"xyz Ltd","company_email":"123#gmail.com"},{"company_name":"wer Jit","company_email":"2222#gmail.com"}]
assuming you get this json in your ajax success:
const json = '[ {
"company_name": "xyz Ltd",
"company_email": "123#gmail.com"
},
{
"company_name": "wer Jit",
"company_email": "2222#gmail.com"
}]
';
const obj = JSON.parse(json);
// you don't need this line, if you have set ajax datatype:'json'
you can get results for a single data set:
console.log(obj[0].company_name);
// this is how to get the first company name of the data set
// expected output: "xyz Ltd"
or you can loop through the whole data set
obj.forEach(element => $("#result").append(element.company_name + '<br>'));
see a working example
conclusion: your ajax function could look just simply like this:
$.ajax({
type: "POST",
url: "<?php echo base_url();?>email/get_company",
data: {
vals: vals
},
datatype: 'json',
success: function(data) {
obj.forEach(data => $("#result").append(data.company_name + '<br>'));
}
})

Unable to receive data using AJAX post in Laravel

I am trying to send some variables(data),one is the checkbox text, and other is the value in the textarea field to the controller in Laravel through ajax, below is the script:
<script>
$('#btn1').on('click', function() {
$('input[type="checkbox"]').on('click', function() {
var aa=$(this).next('label').text();
var bb=$('textarea#txt2').val();
$.ajaxSetup({
headers:
{'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}
});
$.ajax({
type: "POST",
url: "/masterdata",
//dataType: 'json',
data: {aa,bb},
success:function(){
console.log(data);
}
,error:function(){
console.log("Error!!!!");
}
});
});
});
</script>
On trying to retrieve the request values in the controller, only the request token gets displayed, and the ajax function doesn't display the success or error message either.What am I missing here?
you need to set a variable on ajax success like this:
$.ajax({
type: "POST",
url: "/masterdata",
//dataType: 'json',
data: {aa,bb},
success:function(response){
console.log(response);
}
,error:function(){
console.log("Error!!!!");
}
});
Try your data as in this format:
data:{'posa': aa, 'posb': bb},
and
success:function(data){
console.log(data);
}
Hope this helps.
i found two issue in your ajax request.
you have to change data: {aa,bb}, to object like data: {aa : aa, bb : bb},
Your success response log is wrong. Current code success:function(), it should be success:function(data)
Full output of new code is :
<script>
$('#btn1').on('click', function() {
$('input[type="checkbox"]').on('click', function() {
var aa=$(this).next('label').text();
var bb=$('textarea#txt2').val();
$.ajaxSetup({
headers:
{'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}
});
$.ajax({
type: "POST",
url: "/masterdata",
dataType: 'json',
data: {aa : aa, bb : bb},
processData: false,
cache: false,
async :false,
success:function(data){
console.log(data);
}
,error:function(){
console.log("Error!!!!");
}
});
});
});
</script>
To get parameter value in controller use
/**
* Store.
*
* #param Request $request
* #return Response
*/
public function store(Request $request)
{
$aa = $request->input('aa');
$bb = $request->input('bb');
//Your code here
}
<script>
$('#btn1').on('click', function() {
$('input[type="checkbox"]').on('click', function() {
var aa=$(this).next('label').text();
var bb=$('textarea#txt2').val();
$.ajaxSetup({
headers:
{'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}
});
$.ajax({
type: "POST",
url: "/masterdata",
//dataType: 'json',
data: 'aa=test'+'&bb=test',
success:function(){
console.log(data);
}
,error:function(){
console.log("Error!!!!");
}
});
});
});
</script>

When use datatables in Ajax call, paging is not working

When I use the code below, paging is not working. Where am I wrong?
var data = '';
$.ajax({ type: "GET",
url: "include/tables/data.php",
async: false,
success: function(data) {
$("#result").html(data);
$('#mytable').DataTable({});
}
});

In Codeigniter when insert data in db alert message is not displaying, directly it is redirecting

i am using codigniter .when i am inserting or updating data in mysqldb data is inserting.my form is in popup.then alert is getting but redirecting was not working..issue is redirected is displaying in popup not to page .can you please tell the alternate solution ..i am using ajax update to my form
This is my code of controller
$testid=$this->objTests->updateTest();
echo "<script> alert('sucessfully updated');</script>"
redirect(base_url().'tests');
this is my following code of model:
$testData = array('simulationId' => $this->input- >post('simulationId'),
'testTitle' => $this->input->post('testTitle'),
'description ' => $this->input->post('description')
);
$this->db->where('id',$this->input->post('tid'));
$this->db->update('tests',$testData);
return $this->input->post('tid');
$(function(){
$( "#frmActiontest" ).submit(function( event ) {
var url = $(this).attr('action');
$.ajax({
url: url,
data: $("#frmActiontest").serialize(),
type: $(this).attr('method')
}).done(function(data) {
//window.location.href="http://neuronguru.com/MedAdmin/tests/";
window.location.reload();
/*$('#result').html(data);
$('#frmActiontest')[0].reset();*/
});
event.preventDefault();
});
$( ".test" ).on("click",function(event) {
var url = $(this).data('url');
var actionUrl = $(this).data('actionurl');
console.log(actionUrl);
$("#frmActiontest").attr('action',actionUrl);
$.ajax({
url: url,
type: "GET",
dataType: 'json'
}).done(function(data) {
data=data[0];
$("#myModalTestLabel").html("Update Test");
$("#simulationId").val(data.simulationId);
$("#testTitle").val(data.testTitle);
$("#description").val(data.description);
//$("#contents").val(data.contents);
$("#tid").val(data.id);
$("#testModal").trigger("click");
console.log(data);
});
event.preventDefault();
});
});
this is my ajax function for the above question

bootstrap modal ajax call as callback

I have a bootstrap modal which holds a form and from holds a select option field and I would like to populate this with help of ajax on modal('show')
So I have been trying the following but on first click won't fire and after each click the request are duplicated
$('#addNew').modal('show');
$('#addNew').on('show.bs.modal', function(e) {
//ajax call to populate select option
var url = ajaxurl + '?action=getCategories';
$.ajax({
type: "POST",
cache: false,
success: function(html) {
}
});
});
Why not changing the scenario?
function showAddNewModal(){
//ajax call to populate select option
var url = ajaxurl + '?action=getCategories';
$.ajax({
type: "POST",
cache: false,
success: function(html) {
//populate select option here
$('#addNew').modal('show');
}
});
}
Also when you are using POST method , you should change your request to :
$.ajax({
url:ajaxurl,
data:{"action":"getCategories"},
type: "POST",
cache: false,
success: function(html) {
//populate select option here
$('#addNew').modal('show');
}
});

Resources