Reputation: 3664
i am trying to make a ajax call by making use of jquery UI library(jquery autocomplete) from my view page to get the name of department based on user input. Autocomplete function looks like
$( "#auto_complete" ).autocomplete({
source: function( request, response ) {
$.ajax({
url: "/employees/getAddress",
dataType: "jsonp",
data: {
featureClass: "P",
style: "full",
maxRows: 12,
name_startsWith: request.term
},
success: function( data ) {
response( $.map( data.geonames, function( item ) {
return {
label: item.name,
value: item.id
}
}));
}
});
},
minLength: 2,
select: function( event, ui ) {
log( ui.item ?
"Selected: " + ui.item.label :
"Nothing selected, input was " + this.value);
},
open: function() {
$( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
},
close: function() {
$( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
}
});
here i am making a call to action called getAddress()
which looks like
class EmployeesController extends AppController {
//var $components = array('Autocomplete');
public $components = array('RequestHandler');
var $helpers = array('Javascript', 'Ajax');
/**
* index method
*
* @return void
*/
//var $helpers = array('Ajax');
public function getAddress() {
$this->log($this->params, 'debug');
$this->layout = 'ajax';
$departments = $this->Department->find('all', array(
'conditions'=>array('Department.name LIKE'=>$this->params['url']['q'].'%'),
'fields'=>array('name', 'id')));
$this->log($departments, 'debug');
//$this->set('departments', $departments);
$this->set(compact('departments'));
}
but whenever i am making ajax call i am getting error
"NetworkError: 404 Not Found - http://localhost/employees/getAddress?callback=jQuery1710012251482368207167_1333972423088&featureClass=P&style=full&maxRows=12&name_startsWith=sal&_=1333972426249"
how to solve this problem?
Upvotes: 0
Views: 1315
Reputation: 100175
I guess you are missing the project folder in url, try:
var webroot = '<?php echo $this->webroot; ?>';
$( "#auto_complete" ).autocomplete({
source: function( request, response ) {
$.ajax({
url: webroot + "employees/getAddress",
dataType: "jsonp",
data: {
......
Or you could define webroot in layouts/default.ctp and use it
Upvotes: 1