Отобразить значение штата и района в раскрывающемся списке выбранного клиента, используя ajax in laravel - PullRequest
0 голосов
/ 28 февраля 2020

Я получаю данные о выбранном клиенте в различном вводимом тексте, но теперь я запутался, как отобразить состояние в раскрывающемся списке и районе. Государство и район зависят. Моя задача - когда я выбираю имя, отображаю состояние в раскрывающемся списке и, если какое-либо имя не нажимается, по умолчанию все состояние отображается в раскрывающемся списке. пожалуйста, нужны решения.

Маршрут:

Route::get('/billing', function () {
          $states = DB::table("state")->pluck("state_name","state_id");
          return view('billing',compact('states'));
});
Route::get('/autocomplete', 'BillingController@fetch');

Blade-файл:

<div class="row">
    <div class="col-sm-4">
        <p class="c-black f-500">Customer Pincode</p>
        <div class="form-group">
            <div class="fg-line">
                <input type="text" class="form-control" name="customer_pincode" id="customer_pincode" value="">
            </div>
        </div>
    </div>
    <div class="col-sm-4">
        <p class="c-black f-500">Adhar Number</p>
        <div class="form-group">
            <div class="fg-line">
                <input type="text" class="form-control" name="adhar_number" id="adhar_number" value="">
            </div>
        </div>
    </div>
    <div class="col-sm-4">
        <p class="c-black f-500">GST Number</p>
        <div class="form-group">
            <div class="fg-line">
                <input type="text" class="form-control" name="gst_number" id="gst_number" value="">
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-sm-4">
        <p class="c-black f-500">State</p>
        <div class="form-group">
            <div class="fg-line">
                <!-- <input type="text" class="form-control" name="state" id="state" value=""> -->
                <select class="form-control" name="state" id="state">
                    <option value=""></option>
                    @foreach($states as $key => $state)
                        <option value="{{$key}}"> {{$state}}</option>
                    @endforeach
                </select>
            </div>
        </div>
    </div>
    <div class="col-sm-4">
        <p class="c-black f-500">District</p>
        <div class="form-group">
            <div class="fg-line">
                <select name="district" class="form-control" id="district">
                </select>
            </div>
        </div>
    </div>
</div>

Контроллер:

public function get_details_customer(Request $req)
{
    $get_details_customer=DB::table('customer')
    ->join('state','customer.state','=','state.state_id')                                
    ->join('district','customer.district','=','district.district_id')
    ->select('customer.*','state.*','district.*')
    ->where('customer_id',$req->cust_id)
    ->first();
    if($get_details_customer)
    {
        return response()->json(['customer_name'=> $get_details_customer->customer_name,'customer_mobile'=>$get_details_customer->customer_mobile,'customer_email'=> $get_details_customer->customer_email,'customer_pincode'=>$get_details_customer->customer_pincode,'customer_address'=>$get_details_customer->customer_address,'adhar_number'=>$get_details_customer->adhar_number,'gst_number'=>$get_details_customer->GST_number,'state'=>$get_details_customer->state_name,'district'=>$get_details_customer->district_name]);
    }

}

public function fetch(Request $request)
{
    if($request->get('query'))
    {
        $query = $request->get('query');

        if(is_numeric($query))
        {
            $data = DB::table('customer')
            ->where('customer_mobile', 'LIKE', "%{$query}%")
            ->get();
            $output = '<ul class="dropdown-menu" style="margin-left:16px;top:68px;display:block;position:auto;width:auto">';
            foreach($data as $row)
            {
                $output .= '
                       <li data-id="'.$row->customer_id.'"><a href="#">'.$row->customer_mobile.'</a></li>
                       ';

            }
            $output .= '</ul>';
            echo $output;

        }
        //is_string($query)
        else
        {
            $data = DB::table('customer')
            ->where('customer_name', 'LIKE', "%{$query}%")
            ->get();
            $output = '<ul class="dropdown-menu" style="margin-left:16px;top:68px;display:block;position:auto">';
            foreach($data as $row)
            {
                $output .= '
                       <li data-id="'.$row->customer_id.'"><a href="#">'.$row->customer_name.'</a></li>
                       ';
            }
            $output .= '</ul>';
            echo $output;
        }

     }
 }

JavaScript:

<script>
$(document).ready(function(){
$('#name').keyup(function(){    
    var query = $(this).val();
    if(query != '')
    {
        var _token = $('input[name="_token"]').val();
        $.ajax({
            url:"{{ url('/autocomplete') }}",
            method:"get",
            data:{query:query, _token:_token},
            success:function(data){
                $('#nameList').fadeIn();  
                $('#nameList').html(data);
            }
        });
    }
});

$(document).on('click', 'li', function(){
    var cust_id=$(this).attr('data-id');
    $('#name').val($(this).text());
    $('#nameList').fadeOut();  
    jQuery.ajax({
        url: "{{ url('/get-details-customer') }}",
        method: 'get',
        data: {
            cust_id:cust_id
        },
        success: function(result){
            jQuery('#customer_mobile').val(result.customer_mobile);
            jQuery('#customer_email').val(result.customer_email);
            jQuery('#customer_pincode').val(result.customer_pincode);
            jQuery('#adhar_number').val(result.adhar_number);
            jQuery('#gst_number').val(result.gst_number);
            jQuery('#state').val(result.state);
            jQuery('#district').val(result.district);
            //jQuery('#customer_address').val(result.customer_address);                 
        }
    });   
});
});
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...