CakePHP 3.X中的自动完成小部件

时间:2015-10-19 22:38:17

标签: php cakephp autocomplete cakephp-3.0

我试图通过学校的自动完成控件,为学生在我的网站上注册实施表单。为此,我去了 CakePHP 3.0 引用并找到了tutorial to achieve this。我的问题是他们没有明确说明如何检索自动完成的数据(在这种情况下是学校名称数组),因此我无法使其工作。 这是我的代码:

register.ctp

<h1>Registration</h1><br>
<?php echo $this->Form->create('User', array('action' => 'register', 'context' => ['validator' => 'registerValidator'], 'templates' => ['autocomplete' => '<input id="school" name="{{name}}"{{attrs}}>'])); ?>
<?php echo $this->Form->input('fname', array('label' => 'First Name *', 'required' => true, 'placeholder' => 'First Name')); ?>
<?php echo $this->Form->input('sname', array('label' => 'Last Name *', 'required' => true, 'placeholder' => 'Last Name')); ?>
<?php echo $this->Form->input('country', array('options' => array('Select...', 'India', 'USA', 'Canada'), 'placeholder' => 'Select')); ?>
<?php //echo $this->Form->input('school', array('label' => 'School *', 'options' => array('Select...', 'School A', 'School B', 'School C'))); ?>
<?php
$this->Form->addWidget(
        'autocomplete', ['Autocomplete', 'App\View\Widget\Autocomplete']
);
$options = array("Arena", "Bambu", "Canela", "Perlita");
//echo $this->Form->input('School', ['type' => 'autocomplete']);
echo $this->Form->input('search', ['type' => 'autocomplete', 'label' => 'School *', 'id' => 'school', 'required' => true, 'autocomplete' => 'off', 'placeholder' => 'School']);
//echo $this->Form->autocomplete('search', $options);
?>
<?php echo $this->Form->input('province_region', array('label' => 'Province/Region', 'placeholder' => 'Province/Region')); ?>
<?php echo $this->Form->input('city_town', array('label' => 'City/Town', 'placeholder' => 'City/Town')); ?>
<?php echo $this->Form->input('email', array('label' => 'E-mail *', 'required' => true, 'placeholder' => 'Email')); ?>
<?php echo $this->Form->input('birth_dt', ['type' => 'date', 'label' => 'Date of birth *', 'minYear' => date('Y') - 100, 'maxYear' => date('Y'), 'empty' => '-', 'default' => '', 'required' => true]);
?>

<?php echo $this->Form->input('password', array('label' => 'Password *', 'required' => true, 'placeholder' => 'Password')); ?>

<?php
echo $this->Form->input('pwd_repeat', array('label' => 'Confirm Password *', 'type' => 'password', 'required' => true, 'placeholder' => 'Repeat Password'));
echo $this->Form->submit('Send');
?>

Autocomplete.php        

   namespace App\View\Widget;

   use Cake\View\Widget\WidgetInterface;
   use Cake\View\Form\ContextInterface;

   class Autocomplete implements WidgetInterface {

protected $_templates;

public function __construct($templates) {
    $this->_templates = $templates;
}



public function render(array $data, ContextInterface $context) {
    $data += [
        'name' => '',
    ];
    return $this->_templates->format('autocomplete', [
                'name' => $data['name'],
                'attrs' => $this->_templates->formatAttributes($data, ['name'])
    ]);
}

public function secureFields(array $data) {
    // return [];
    return [$data['name']];
}

}

?>

UsersController.php

<?php



namespace App\Controller;

use App\Controller\AppController;
use Cake\ORM\TableRegistry;
use Cake\Mailer\Email;
use Cake\Routing\Router;
use Cake\Event\Event;
use Cake\Validation\Validator;

class UsersController extends AppController {

public $helpers = [
    'Form' => [
        'widgets' => [
            'autocomplete' => ['App\View\Widget\Autocomplete']
        ]
    ]
];
....

这是输出:

Can't make it work!

任何类型的帮助都将非常感激。在此先感谢您的帮助。

1 个答案:

答案 0 :(得分:2)

autocomplete输入会显示仅使用相同浏览器的早期类型值。

  

autocomplete属性指定输入字段是否应启用自动完成功能。

     

自动填充功能允许浏览器预测值。当用户开始输入字段时,浏览器应显示填写字段的选项,基于先前输入的值

来源:http://www.w3schools.com/tags/att_input_autocomplete.asp
你想显示搜索引擎显示的建议。要重新搜索数据,您需要使用javascript。