Highlighting search keyword

Question

I created a simple database and there is a live search,i want to know how to highlighting search keywords in the table. I've been using other means but still it doesn't work. please help me

this is my code :

$(document).ready(function(){
    load_data();

    function load_data(search){
      $.ajax({
        url:"get_data.php",
        method:"POST",
        data: {
          search: search
        },
        success:function(data){
          $('#hasil').html(data);
        }
      });
    }
    $('#search').keyup(function(){
      var search = $("#search").val();
      load_data(search);
    });


    function highlight_word(hasil)
      {
          var text = document.getElementById("search").value;
          if(text)
          {
              var pattern=new RegExp("("+text+")", "gi");
              var new_text=hasil.replace(pattern, "<span class='highlight'>"+text+"</span>");
              document.getElementById("hasil").innerHTML=new_text; 
          }
      }

html :

  <input type="text" class="form-control" id="search" name="search" >
  <div id="hasil"></div>

_What_ doesn't work? Blank page? Wrong words highlighted? Wrong color? Do you call `highlight_word` somewhere? — brombeer, Mar 15 '22 at 06:35
The search went well, whose highlights didn't work. i think no the highlight just there. — Devita Widya, Mar 15 '22 at 06:41

score 2 · Accepted Answer · answered Mar 15 '22 at 07:09

2

You've never called highlight_word() function somewhere. you may replace your success function via:

success:function(data){
      $('#hasil').html(data);
      highlight_word(data);
    }

answered Mar 15 '22 at 07:09

Milad Elyasi

789
4
12

Thank you so much for the advice you gave. i've tried the code and it worked – Devita Widya Mar 15 '22 at 08:18

score 0 · Answer 2 · answered Mar 15 '22 at 06:36

0

Follow This Article. You could this way

[https://stackoverflow.com/questions/8644428/how-to-highlight-text-using-javascript][1]

answered Mar 15 '22 at 06:36

Tayfun Yuksel

142
9

oke, thank you. I've seen that before. – Devita Widya Mar 15 '22 at 06:45

Highlighting search keyword

2 Answers2