views:

1074

answers:

1

hi, I'm trying to have an auto complete box in my application,where the values are retrieved from a table.

I want to share a form with set of users in the Users table. i have a link called 'Share' and when I click the link, the autocomplete box is generated.

Now when I type in the text box any letter, I want it to be auto suggested.

This is my view file, /views/main/home.ctp

<?php echo $javascript->link('prototype');?>
<?php echo $javascript->link('scriptaculous');?>
<?php echo $javascript->link('effects');?>
<?php echo $javascript->link('controls');?>

$(document).ready(function(){

    $(".Share<?=$r['Form']['id'];?>").click(function(){
        $("#share<?=$r['Form']['id'];?>").toggle("show");
  });
});

<li id="Share<?php echo $r['Form']['id']?>">
  <a href="#" class="Share<?=$r['Form']['id'];?>">Share</a>
  <div id="share<?php echo $r['Form']['id']?>">
   <?php echo $form->create('User', array('url' => '/forms/share'));?>
      <?php echo $ajax->autoComplete('User.name', '/forms/autoComplete');?>
      <?php echo $form->end('Share');?>
</div>  
</li>

This is my auto_complete.ctp file:/views/forms/auto_complete.ctp

<?php echo $javascript->link('scriptaculous.js');?>
<?php echo $javascript->link('prototype.js');?>
 <ul>
     <?php foreach($users as $user): ?>
        <li><?php echo $user['User']['name']; ?></li>
     <?php endforeach; ?>
</ul>

And this this the function in the forms_controller: /forms/autoComplete

function autoComplete()
{
 $this->set('users',$this->User->find('all',array('conditions'=>array('User.name LIKE' => $this->data['User']['name'].'%'))));
    $this->layout = "ajax";
}

I get the results in the auto_complete.ctp file, i.e, if I type in the letter 's' in the autoComplete text box, I get the corresponding users in that file, but I do not get those values in the text box. Someone help me please.

+1  A: 

Well I found the answer myself.

Autocomplete feature of cakephp does not work if you use JQuery.

I removed the line

 <?php echo $javascript->link('jquery');?>

and it is working...

EDIT:

If you also want to work with jquery and need the jquery.js file, you would need to enable no-conflict mode in jQuery,as given in the site http://docs.jquery.com/Using_jQuery_with_Other_Libraries

Angeline Aarthi