Filter googleApiFont Result on search Laravel

I'm using laravel5 and i sucsessfully fetching the google fonts from googlefontapi as json data , print it in my page using blade's @foreach My code is

public function index(){


    $url = "http://ift.tt/28ONRKg!";
    $result = json_decode(file_get_contents( $url ));
    $font_list = "";
    foreach ( $result->items as $font )
    {
        $font_list[] = [
            'font_name' => $font->family,
            'category' => $font->category,
            'variants' => implode(', ', $font->variants),
            // subsets
            // version
            // files
        ];
    }

    return view('website_settings')->with('data', $font_list);

}

And the view

 <div class="am-fonts scroll">
      <ul class="am-fonts-list">

        @foreach($data as $fonts)
            <li>
                <link rel="stylesheet" href="http://ift.tt/1DTzkb1 echo $fonts['font_name'];?>:<?php echo $fonts['variants'];?>">
                <div class="am-actions"><a href=""><span><i class="icon add"></i></span></a></div>
                <div class="am-font-preview" style="font-family: <?php echo $fonts['font_name'];?>;">
                 <a href="">Grumpy wizards make toxic brew for the evil Queen and Jack.</a>
                </div>
                <div class="am-font-details">
                    <div class="am-font-name">{!! $fonts['font_name'] !!}</div> 
                </div>
            </li>
        @endforeach

      </ul>

i have a search box, now what i want to do is filter this fontlist when searching on the input text(no submit button)! how can i achieve this ? Please help me !

from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/28RADdx
via IFTTT