Answers.Body: <p>You wouldn't need to create or build a module, you can simply create the functionality with twig itself and use queries in the twig template:</p>
  <p><a href="https://craftcms.com/knowledge-base/search-form" rel="nofollow noreferrer">https://craftcms.com/knowledge-base/search-form</a></p>
  <p>If you want a live search you can use the sprig plugin and follow this:</p>
  <p><a href="https://putyourlightson.com/sprig/cookbook#search" rel="nofollow noreferrer">https://putyourlightson.com/sprig/cookbook#search</a></p>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2022-12-15T22:25:50.240Z
Answers.Text: Wow! I didn't expect it to be done so easily in this engine) tnx)))
Answers.UserDisplayName: Dimi
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2022-12-15T13:53:03.663Z
Answers.LastActivityDate: 2022-12-15T13:53:03.663Z
Answers.UserDisplayName: Michael Thomas
Body: <p>I had a website on an old engine. And there I had a live search organized. Now I have decided to change the engine to CRAFT CMS and, accordingly, I need to organize a live search on the new engine.
  I'll tell you how the live search was organized on the OLD ENGINE</p>
  <p><strong>On the old engine</strong> I had this HTML structure:</p>
  <pre><code>&lt;form action=&quot;/games/&quot; method=&quot;get&quot;&gt;
      &lt;div class=&quot;form&quot;&gt;
          &lt;input placeholder=&quot;Name&quot; type=&quot;text&quot; name=&quot;title&quot; id=&quot;search_text&quot;&gt;
          &lt;button&gt;GO&lt;/button&gt;
      &lt;/div&gt;
      &lt;div id=&quot;results&quot; class=&quot;search_results&quot;&gt;&lt;/div&gt;
  &lt;/form&gt;
  </code></pre>
  <p><strong>On the old engine</strong>, I had this JQUERY handle:</p>
  <pre><code>$(&quot;#search_text&quot;).bind(&quot;keyup&quot;, function() {
      if(this.value.length &gt;= 1){
          var searchString = $(this).val();
          var data = 'search='+ searchString;
          if(searchString) {
              $.ajax({
                  type: 'POST',
                  url: &quot;/functions/fast_search_result.php&quot;,
                  data: data,
                  success: function(html){
                      $(&quot;#results&quot;).addClass(&quot;infocus&quot;);
                      $(&quot;#results&quot;).html(html);
                  }
              });
          }
      }else{
      $(&quot;#results&quot;).html('');
  }
  });
  </code></pre>
  <p><strong>On the old engine</strong>, the file code <strong>fast_search_result.php</strong> was like this:</p>
  <pre><code>&lt;?php
      $search_text = $_POST['search'];
  
      $link = mysqli_connect('localhost', 'user', '123456789', 'name_db');
  
      $sql = mysqli_query($link, &quot;SELECT `title`, `url` FROM `games` WHERE `title` LIKE `%&quot;.$search_text.&quot;%` &quot;);
      $results = mysqli_fetch_array($sql);
      foreach($results as $result){
  
          $title = $result['title'];
          $url = &quot;/link/to/my/game/&quot;.$result['url'].&quot;/&quot;;
  
          echo &quot;&lt;div class='game'&gt;&quot;;
              echo &quot;&lt;a href='&quot;.$url.&quot;' class='name'&gt;&quot;.$title.&quot;&lt;/a&gt;&quot;;
          echo &quot;&lt;/div&gt;&quot;;
  
      }
  ?&gt;
  </code></pre>
  <p>That's the same thing I want to organize on CRAFT CMS. But only how to do it? I'm new to CRAFT CMS, I have an idea how to do it:</p>
  <ol>
  <li>in the TWIG template, organize the form</li>
  <li>Build a module that, when passing a POST to it, will work out this post and return the result. The module will work by URL, for example, /module/fast_search_result/</li>
  <li>Well, leave the jquery handler the same, replacing in it only the path by which I will process the POST</li>
  </ol>
  <p>If my idea is wrong or there is an easier way, please tell me. I will be glad)</p>
  
Tags: <craft3>
Title: How to organize a live search on a website?
ThreadText: # How to organize a live search on a website?
  
  (Asked by: username_0 on 2022-12-15)
  
  I had a website on an old engine. And there I had a live search organized. Now I have decided to change the engine to CRAFT CMS and, accordingly, I need to organize a live search on the new engine.
  I'll tell you how the live search was organized on the OLD ENGINE
  
  **On the old engine** I had this HTML structure:
  
  ```
  <form action="/games/" method="get">
      <div class="form">
          <input placeholder="Name" type="text" name="title" id="search_text">
          <button>GO</button>
      </div>
      <div id="results" class="search_results"></div>
  </form>
  
  ```
  
  **On the old engine**, I had this JQUERY handle:
  
  ```
  $("#search_text").bind("keyup", function() {
      if(this.value.length >= 1){
          var searchString = $(this).val();
          var data = 'search='+ searchString;
          if(searchString) {
              $.ajax({
                  type: 'POST',
                  url: "/functions/fast_search_result.php",
                  data: data,
                  success: function(html){
                      $("#results").addClass("infocus");
                      $("#results").html(html);
                  }
              });
          }
      }else{
      $("#results").html('');
  }
  });
  
  ```
  
  **On the old engine**, the file code **fast\_search\_result.php** was like this:
  
  ```
  <?php
      $search_text = $_POST['search'];
  
      $link = mysqli_connect('localhost', 'user', '123456789', 'name_db');
  
      $sql = mysqli_query($link, "SELECT `title`, `url` FROM `games` WHERE `title` LIKE `%".$search_text."%` ");
      $results = mysqli_fetch_array($sql);
      foreach($results as $result){
  
          $title = $result['title'];
          $url = "/link/to/my/game/".$result['url']."/";
  
          echo "<div class='game'>";
              echo "<a href='".$url."' class='name'>".$title."</a>";
          echo "</div>";
  
      }
  ?>
  
  ```
  
  That's the same thing I want to organize on CRAFT CMS. But only how to do it? I'm new to CRAFT CMS, I have an idea how to do it:
  
  1. in the TWIG template, organize the form
  2. Build a module that, when passing a POST to it, will work out this post and return the result. The module will work by URL, for example, /module/fast\_search\_result/
  3. Well, leave the jquery handler the same, replacing in it only the path by which I will process the POST
  
  If my idea is wrong or there is an easier way, please tell me. I will be glad)
  
  **Tags:** craft3
  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_1 on 2022-12-15. Score: 2 | Accepted answer
  
  You wouldn't need to create or build a module, you can simply create the functionality with twig itself and use queries in the twig template:
  
  <https://craftcms.com/knowledge-base/search-form>
  
  If you want a live search you can use the sprig plugin and follow this:
  
  <https://putyourlightson.com/sprig/cookbook#search>
  
  > **Comments:**
  > **username_0**: Wow! I didn't expect it to be done so easily in this engine) tnx)))  
  
  ---
  
  