Question

https://www.tripadvisor.com.ph/Hotels

表示输入您的城市或酒店。当您开始输入时，建议会显示在下面。

我想在我的搜索表单上使用相同的功能。关于如何做的任何想法？

这是我的代码：

public function Form()
{
    $QualificationTypes = array("Any degree");
    foreach (QualificationType::get()->filter("ParentID", 0)->sort("Name") as $QualificationType) {
        $QualificationTypes[$QualificationType->Name] = $QualificationType->Children()->sort("Name")->map()->toArray();
    }


    $fields      = new FieldList(array(
        GroupedDropdownField::create("QualificationTypeID", "", $QualificationTypes)->setAttribute('placeholder','Type of degree')->setEmptyString("Any degree")->addExtraClass("chosen-select"),
        DropdownField::create("CourseName", "", Qualification::get()->sort("Name")->map("Name","Name"))->setAttribute('placeholder','Course')->setEmptyString("Any Course")->addExtraClass("chosen-select"),
        DropdownField::create("CityID", "", City::getCitiesWithInstitutions()->sort("Name")->map())->setAttribute('placeholder','City')->setEmptyString("Any city")->addExtraClass("chosen-select")
    ));
    $actions     = new FieldList(array(
        FormAction::create("doSearch")->setTitle("Find a College")
    ));
    $validator   = ZenValidator::create();
    $validator->addRequiredFields(array(
        'QualificationTypeID' => 'Please select a Degree'
    ));
    $form        = new Form($this, 'findthem', $fields, $actions, $validator);
    $form->addExtraClass("form-inline college-search")->setAttribute("data-toggle", "validator");
    $form->loadDataFrom($this->request->postVars());
    $form->disableSecurityToken();
    return $form;
}

Answer 1

您提供的Hotels.com示例与您尝试执行的操作略有不同，因为您有多个字段会使其变得更加困难。

比如说你有一个领域＆＃34;搜索大学＆＃34;你可以用Jquery Autocomplete之类的东西！然后构建一个简单的SilverStripe function！根据用户输入的内容返回对象。

我建议您阅读上面关于SilverStripe控制器的页面，因为您需要了解它们的功能，例如：路由和操作。

以下是自动完成集成的简单示例。 SilverStripe函数需要处理此后端。

var users = {};

app.get('/login/facebook/return',
  passport.authenticate('facebook', { failureRedirect: '/login' }),
  function(req, res) {

    // save user to users object
    users[req.user.id] = {
      displayName: req.user.displayName,
      profileImage: req.user._json.picture.data.url
    }

    res.redirect('/');
  });

// you need to use some kind of sessions or cookies to know which user this is
// for simplicity let's assume you get profile by user's id /profileInfo/:id
app.get('/profileInfo/:id', function(req, res) {

  res.json(users[req.params.id]);

});

一个超级简单的PHP函数

$('.product-search').autocomplete({
    serviceUrl : pageURL + '/CollegeSearch',
    minChars : 3,
    onSearchStart : function(input) {
        dataLayer.push({
            'event': 'searchKeyword',
            'eventLabel': input.query
        });
    },
    onSelect : function(suggestion) {
        dataLayer.push({
            'event': 'searchProduct',
            'eventLabel': suggestion.value
        });
        window.location = suggestion.data;
    }
});

在Silverstripe的搜索表单上自动建议文本字段？

1 个答案: