mercredi 9 mai 2018

Autocomplete search by like query dependent on select box

Focus on points:

  • Autocomplete search (table : symbols have -col; symbol, market_id, id)
  • Select box (table : market -col; id, market)

Search Result must be match with select box (id = market_id) then, result

I am using ajax for this api….

Route/web.php code

Route::get('api/search-symbol', 'MemberTradesController@searchSymbol');

Controller code

public function searchSymbol(Request $request , $id )
{
    $data = [];

    if($request->has('q')){
        $search = $request->q;
        $data = DB::table("symbols")

            ->where("market_id", $id)
            ->select('symbol', 'id')
            ->where('symbol','LIKE',"%$search%")
            ->get();
    }

    return response()->json($data);
}

**AJAX & view code **

<script type="text/javascript">
       // $("#symbol").attr("disabled", "disabled");
      //$("#market").attr("disabled", "disabled");
        $('#symbol').select2({
            placeholder: 'Select an item',
            ajax: {
                url: 'WHAT SHOULD BE URL: HERE?',
                dataType: 'json',
                delay: 250,
                processResults: function (data) {
                    return {
                        results:  $.map(data, function (item) {
                            return {
                                text: item.symbol,
                                id: item.id
                            }
                        })
                    };
                },
                cache: true
            }
        });


    </script>
    {!! Form::open(['method'=>'POST', 'action'=> 'MemberTradesController@store']) !!}

<div class="form-group col-sm-5">
                {!! Form::label('market_id', 'Markets:') !!}
                {!! Form::select('market_id', [''=>'Choose Options'] , null, ['class'=>'form-control', 'id'=>'market'])!!}
            </div>
            
             <div class="form-group col-sm-10">
            {!! Form::label('symbol', 'Symbol:') !!}
            {!! Form::select('symbol_id', [''=>'Choose Options'] ,  null, ['class'=>'symbol_id', 'id'=>'symbol','data-width'=>'60%', 'data-live-search'=>'true'] )!!}
        </div>
        
         <div class="form-group col-lg-4">
                {!! Form::submit('Add trade', ['class'=>'btn btn-success btn-lg']) !!}
            </div>

            {!! Form::close() !!}


via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire