Автозаполнение JqueryUI не работает в CakePHP 2.0 - PullRequest
Новая
       26

Автозаполнение JqueryUI не работает в CakePHP 2.0

0 голосов
/ 18 февраля 2012

Мое автозаполнение не работает, и я не могу определить ошибку.

Jquery 

<script>
$(function() {
    $('#autoComplete').autocomplete({
        //source: "/groceries/items/autoComplete", ///This works but response isn't formatted correctly'
        //dataType: "json"
        minLength: 2,
        source: function( request, response ) {
            $.ajax({
                url: "/groceries/items/autoComplete",
                dataType: "jsonp",
                data: {
                    featureClass: "P",
                    style: "full",
                    maxRows: 12,
                    term: request.term
                },
                success: function( data ) {
                    response( $.map( data, function( el ) {
                        return { label: el.id, value: el.name }
                    }));
                }
            });
        }
    });
});

Контроллер : 

public function autoComplete() {
        Configure::write('debug', 0);
        $this->layout = 'ajax';
        $query = $_GET['term'];
        $items = $this->Item->find('all', array(
            'conditions' => array('Item.name LIKE' => $query . '%'),
            'fields' => array('name', 'id', 'category_id'),
            'group' => array('name')));
        $this->set('items', $items);
    }

Форма 

    <p>
    <?php echo $this->Form->create('Item', array('model'=>'item','action' => 'addItem', 'name'=>'AddItem'));?>
        <?php echo $this->Form->text('Item.name', array('size'=>'30', 'id'=>'autoComplete', 'autocomplete'=>'off')); ?>
        <?php echo $this->Form->text('Item.category_id', array('type'=>'hidden', 'value'=>'0')); ?>
        <?php echo $this->Form->text('Groclist.id', array('type'=>'hidden', 'value'=>$groclist['Groclist']['id'])); ?>
    <?php echo $this->Form->end('Add'); ?>
</p>

Ответ 

0: {Item:{name:Cake, id:6, category_id:null}}
1: {Item:{name:Carrot Cake, id:9, category_id:null}}
2: {Item:{name:Carrots, id:8, category_id:null}}
3: {Item:{name:Casserole, id:11, category_id:null}}
4: {Item:{name:Cauliflower, id:10, category_id:null}}

Отредактировано для уточнения.

Я понимаю, что JqueryUI ожидает метку и значение, и эта карта должна переставить их, но по некоторым причинам это не так Есть идеи?

Я нашел еще лучшее решение. Это делается полностью в контроллере. Нет просмотра требуется. 

 public function autoComplete() {
        Configure::write('debug', 0);
        *$this->autoRender=false;*
        $this->layout = 'ajax';
        $query = $_GET['term'];
        $items = $this->Item->find('all', array(
            'conditions' => array('Item.name LIKE' => $query . '%'),
            'fields' => array('name', 'id', 'category_id'),
            'group' => array('name')));
        *$i=0;
        foreach($items as $item){
            $response[$i]['value']="'".$item['Item']['id']."'";
            $response[$i]['label']="'".$item['Item']['name']."'";
            $i++;
        }
        echo json_encode($response);*
    }

Ответы [ 2 ]

1 голос
/ 18 февраля 2012

Что если вы уменьшите массив, который возвращается моделью Items.Таким образом, вместо $this->set('items', $items); вы возвращаете закодированные в json результаты, например, так: 

foreach($items as $item) {
    $data[] = $item['Item'];
}
$data = json_encode($data);
echo $data;
exit;

Это внутри метода auto_complete в контроллере.

ОБНОВЛЕНИЕ: При запросенапример, для Cake он вернул бы результат примерно так: 

[
  {"name":"Cake Batter","id":"1","category_id":"3"},
  {"name":"Cake Mix","id":"2","category_id":"3"}
]

, если вы не хотите возвращать json, вы можете просто вернуть $data без кодировки json.

Обновление формата:

Я не уверен, что это «небрежно», но вы можете изменить цикл foreach на: 

foreach($items as $item) {
    $data[]= array(
        'label' => $item['Item']['name'],
        'value' => $item['Item']['id']
    );
}
0 голосов
/ 18 февраля 2012

Похоже, вы забыли Item: 

response($.map( data, function( el ) {
    return { label: el.Item.id, value: el.Item.name }
});

Вы также можете сделать это на стороне сервера, используя Set: 

$this->set('items', Set::extract('/Item', $items));
...