My view
<?php echo $calendar; ?>
<div id="event_area"></div>
<script type="text/javascript">
$(document).ready(function(){
$('.calendar .day').click(function(){
var day_data= $(this).find('.content').html();
if($(this).find('.content').html()!=null){
$.ajax({
url: "<?php echo base_url('calendar/pass_name')?>/",
method:"POST",
data:{'day_data':day_data},
success:function(data){
$('#event_area').html(data);
}
})
My controller:
function pass_name(){
$name=$this->input->post('day_data');
$result=$this->load->model('calendar_model')->get_description($name);
$data['calendar'] = $result;
echo json_encode($data);
}
My model:
function get_description($name){
$query = $this->db
->select('description')
->from('calendar')
->where('name',$name)
->get();
return $query->result();
}
This is an example of the result I am getting in my view.
{"calendar":[{"description":"test description\r\nwww.google.com</a>"}]}
How can I make it better, for instance displaying "test description.." without the characters?
Thanks in advance.
In your ajax success function replace the code as follow
success:function(data){
var obj = $.parseJSON(data);
var content = '';
$.each(obj.calendar, function(i,v){
content+= '<p>'+v.description+'</p>'; //--> here you can add any tag, class
});
$("#event_area").html(content);
}
Hope this code may solve your problem. If you need any further clarification,
I'm happy to help you.
You have to add dataType:'json' in your ajax code:
$.ajax({
url: "<?php echo base_url('calendar/pass_name')?>/",
method:"POST",
dataType:'json',
data:{'day_data':day_data},
success: function(data){
$('#event_area').html(data);
}
});
Related
I am trying to implement cascading drop down box in cakephp 4 using ajax.
I'm getting an 403 error has tried many solutions from google and stack overflow from htaccess till syntax error and logical error can anyone please help trying since long.
Here is my code:
Add.php
<?php echo $this->Form->control('groups',['options' => $groups],array('id'=>'GroupId'));
echo $this->Form->input('user_id',array('id'=>'UsersId'));
?>
<?= $this->Form->button(__('Submit'),array('id'=>'post')) ?>
<?= $this->Form->end() ?>
<?php echo $this->Html->script('//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js');?>
<script type="text/javascript" >
$(document).ready(function(){
$("#groups").change(function(){
var deptid = $(this).val();
//var path="<?php echo $this->Url->webroot ?>/Users/getbygroup";
$.ajax({
url: '../Users/getbygroup',
type: 'POST',
data: deptid,
dataType: 'json',
cache: false,
contentType: false,
success:function(response){
var len = response.length;
$("#UserId").empty();
for( var i = 0; i<len; i++){
var id = response[i]['id'];
var name = response[i]['name'];
$("#UserId").append("<option value='"+id+"'>"+name+"</option>");
}
}
});
});
});
</script>
Add action in files controller:
public function add()
{
$this->loadModel('Users');
$this->loadModel('Groups');
$this->set('groups', $this->Groups->find('list'));
$result = $this->Users->find('all'); // returns query object
$data = $result->toArray(); // converts query object to key value array
$file = $this->Files->newEmptyEntity();
if ($this->request->is('post')) {
$file = $this->Files->patchEntity($file, $this->request->getData());
if ($this->Files->save($file)) {
$this->Flash->success(__('The file has been saved.'));
return $this->redirect(['action' => 'index']);
}
$this->Flash->error(__('The file could not be saved. Please, try again.'));
}
$this->set(compact('file'));
}
getbygroup function in users controller:
public function getbygroup() {
$fname= $this->request->getData('deptid');
$this->viewbuilder()->layout = 'ajax';
$users = $this->Users->find('list', array(
'conditions' => array('Users.group_id' => $fname),
'recursive' => -1));
$this->set('users', $users);
}
I try to display data on the bootstrap select option with ajax, but after I run the data do not want to appear what is wrong?
function get_value() {
$id = 5;
$q = $this->db->select('*')
->from('tbl_v')
->where('id', $id)
->order_by('id', 'ASC')
->get();
$result = $q->result();
echo json_encode($result );
}
$(".change").change(function(){
var value=$(this).val();
if(value>0){
$.ajax({
url: base_url+"get_value",
type:"POST",
dataType: 'json',
cache: false,
data:{id:value},
success: function(respond){
$(".get-change").html(respond).selectpicker('refresh');
}
})
}
});
Try this...
function OnChangeValue()
{
var pdrp = document.getElementById("yourControlIDHere");
getvalue= pdrp.options[pdrp.selectedIndex].value;
alert(getvalue);
}
The Control
<select id="yourControlIDHere" onchange="OnChangeValue(this)" name="companyname" style="width:100%">
Jquery Code
$(".change").change(function(){
var value=$(this).val();
if(value>0){
$.ajax({
url: base_url+"get_value",
type:"POST",
cache: false,
data:{id:value},
success: function(respond){
$(".get-change").html(respond);
}
})
}
});
Modal Code:
function get_records() {
$id = 5;
$q = $this->db->select('*')
->from('tbl_v')
->where('id', $id)
->order_by('id', 'ASC')
->get();
$result = $q->result();
}
Controller Code:
function get_value(){
$ido = $this->input->post('id');
$data = $this->your-model-name->get_records($ido);
$option = "";
foreach($data as $row){
$option .= "<option value='".$value['ID']."'>".$row[0]->name."</option>";
}
echo $option;
}
You need not have to use JSON encoding. Records will be directly appended to the select box. Hope this can help you.
Hi when i want to update my status using a button from inactive to active through ajax method so i have written some code i dont know wether it is right or wrong but status is not updating
This is sample code, This should work
Controller:
public function update_status(){
$status = $this->input->post('status');
$course_id = $this->input->post('id');
$this->CoursesModel->update_course_status($course_id,$status);
}
Model:
public function update_course_status($course_id,$status){
$data['status'] = $status;
$this->db->where('course_id', $course_id);
$this->db->update('courses',$data);
}
Script:
$(document).on('click','.status_checks',function()
{
var status = ($(this).hasClass("btn-success")) ? '1' : '0';
var msg = (status=='0')? 'Deactivate' : 'Activate';
if(confirm("Are you sure to "+ msg))
{
var current_element = $(this);
var id = $(current_element).attr('data');
url = "<?php echo base_url().'index.php/Dashboard/update_status'?>";
$.ajax({
type:"POST",
url: url,
data: {"id":id,"status":status},
success: function(data) {
// if you want reload the page
location.reload();
//if you want without reload
if(status == '1'){
current_element.removeClass('btn-success');
current_element.addClass('btn-danger');
current_element.html('Deactivate');
}else{
current_element.removeClass('btn-danger');
current_element.addClass('btn-success');
current_element.html('Activate');
}
} });
}
});
HTML:
<button type="button" class="status_checks btn <?php echo ($element->status == 1) ? "btn-danger" : "btn-success"; ?> "><?php echo ($element->status == 1) ? "Deactivate" : "Activate"; ?></button>
I guess you should put some info in $data like so
$data['status'] = $status;
$this->db->where('course_id', $course_id);
$this->db->update('courses', $data);
Hope it solves the problem !
I'd like to implement a very customized infinite scroll. But that comes later, cause i'm already stuck at the ajax request. What's wrong with my code (i get alwas a '0' response even though i have die() in the php function and added nopriv ...)??
my header.php:
<script type="text/javascript">
var count = 2;
var total = <?php echo $wp_query->max_num_pages; ?>;
jQuery(window).scroll(function(){
if (jQuery(window).scrollTop() == jQuery(document).height() - jQuery(window).height()){
if (count > total){
return false;
}else{
loadArticle(count);
//viewsite();
}
count++;
}
});
function loadArticle(pageNumber) {
jQuery.ajax({
url: ajaxurl,
type:'POST',
data: {
action: 'ozinfinite_scroll',
page_no: pageNumber
},
success: function(html){
jQuery("#inf-cont-1").append(html);
}
});
return false;
}
</script>
functions.php:
function ozinfinite_scroll(){
// $loopFile = $_POST['loop_file'];
$paged = $_POST['page_no'];
$posts_per_page = get_option('posts_per_page');
# Load the posts
query_posts(array('paged' => $paged ));
get_template_part( 'contentoz', 'blog' );
die();
}
add_action('wp_ajax_ozinfinite_scroll', 'ozinfinite_scroll'); // for logged in user
add_action('wp_ajax_nopriv_ozinfinite_scroll', 'ozinfinite_scroll'); // if user not logged in
function add_ajaxurl_cdata_to_front(){ ?>
<script type="text/javascript"> //<![CDATA[
ajaxurl = '<?php echo admin_url( 'admin-ajax.php'); ?>';
//]]> </script>
<?php }
add_action( 'wp_head', 'add_ajaxurl_cdata_to_front', 1);
thanks for your help!!
According to the docs http://codex.wordpress.org/AJAX_in_Plugins
you should have something like
echo $someValue
before wp_die() or die()
I'm want to create an autosuggest field using twitter bootstraps typeahead plugin. here is my current code. It returns 500 Internal Server Error in inspect elements console. I think the problem is in model. Please help me. Thanks in advance.
view: register
<script type="text/javascript">
$(function() {
$('#office').typeahead({
source: function(typeahead, query) {
$.ajax({
url: "<?php echo base_url('main/get_offices'); ?>",
type: "post",
data: "search=" + query,
dataType: "json",
async: false,
success: function(data) {
typeahead.process(data);
}
});
}
});
});
controller: main
public function get_offices() {
$this->load->model('offices');
$data = $this->offices->get();
echo json_encode($data);
}
model: offices
public function get() {
$office = $this->input->post('search');
$this->db->select('name');
$this->db->from('departments');
$this->db->like('name', $office);
$query = $this->db->get();
$office_array = array();
foreach ($query->result() as $row) {
$office_array = $row->name;
}
//$data['office'] = $office_array;
return $office_array;
}
I tried your code with typeahead in the function parameters but that doesn't seem supported.
I rewrote your code to remove typeahead and return the result outside the scope of the ajax call.
$('#office').typeahead({
source: function(query) {
var result = [];
$.ajax({
url: "<?php echo base_url('main/get_offices'); ?>",
type: "post",
data: "search=" + query,
dataType: "json",
async: false,
success: function(data) {
alert(data); // verify that you actually get data from the model
result = data;
}
});
return result;
}
});
The model function get seems to have a typo, at this part
$office_array = array();
foreach ($query->result() as $row) {
$office_array = $row->name;
}
It should be $office_array[].
$office_array = array();
foreach ($query->result() as $row) {
$office_array[] = $row->name;
}