Daniel
Daniel

Reputation: 43

Selectize finds only the words that start with the given string

Why does Selectize show only the words that start with the given string and not the ones that contain it?

I want to show the matches that contain the specified string, not only those that start with it (the default behavior, I think).

I have reproduced the example from the web and it does not have the same behavior. Why?

https://selectize.dev/docs/demos/single-item-select

My result:

My Test

Selectize example result:

Selectize Web page

My code:

<!DOCTYPE html>
<html lang="es">
    <head>
        <meta charset="utf-8">

        <title> TEST</title>
        <script src="https://code.jquery.com/jquery-3.6.3.min.js" integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU=" crossorigin="anonymous"></script>
        <link
          rel="stylesheet"
          href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.15.2/css/selectize.default.min.css"
          integrity="sha512-pTaEn+6gF1IeWv3W1+7X7eM60TFu/agjgoHmYhAfLEU8Phuf6JKiiE8YmsNC0aCgQv4192s4Vai8YZ6VNM6vyQ=="
          crossorigin="anonymous"
          referrerpolicy="no-referrer"
        />
        <script
          src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.15.2/js/selectize.min.js"
          integrity="sha512-IOebNkvA/HZjMM7MxL0NYeLYEalloZ8ckak+NDtOViP7oiYzG5vn6WVXyrJDiJPhl4yRdmNAG49iuLmhkUdVsQ=="
          crossorigin="anonymous"
          referrerpolicy="no-referrer"
        ></script>
    </head>
    <body>
      <select id="normalize">
        <option value=""></option>
        <option value="1">Awesome</option>
        <option value="2">Beast</option>
        <option value="3">Compatible</option>
        <option value="4">Thomas Edison</option>
        <option value="5">Nikola</option>
        <option value="6">Selectize</option>
        <option value="7">Javascript</option>
      </select>
      <script>
      $('#normalize').selectize();
      </script> 
    </body>
</html>

Thanks.

Upvotes: 0

Views: 269

Answers (2)

Kristian Ashton
Kristian Ashton

Reputation: 47

I had exactly the same problem, which was not solved by loading via the CDN; however, I found the solution (which unfortunately was not a documented on the Selectize web page). There is an undocumented configuration option for Selectize called "respect_word_boundaries". If, upon initialising an Selectize element you set "respect_word_boundaries: false", then the search is within the entire strings. Hope that helps anyone having the same issue! Cheers, Kristian.

Upvotes: 1

Daniel
Daniel

Reputation: 43

The CDN link was not working properly. I have downloaded the latest release from Github and now it is working.

Selectize Github

Upvotes: 1

Related Questions