пытаюсь включить автозаполнение ajax в мою запись создания в laravel - PullRequest
0 голосов
/ 18 февраля 2019

Я обнаружил, что ajax автоматически завершен, и я не хочу, чтобы он интегрировался в мою форму, но я не могу заставить его работать.Пожалуйста, сообщите спасибо!

[контроллер]

<?php
namespace App\Http\Controllers;
use App\Purchasetransactions;
use App\AjaxAutocompleteController;
use App\Products;
use App\Categories;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Session;

class PurchasetransactionsController extends Controller
{
    /**
     * Display a listing of the resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        $purchasetransactions = Purchasetransactions::all();
        return view('orders.index', compact('purchasetransactions'));
    }

    /**
     * Show the form for creating a new resource.
     *
     * @return \Illuminate\Http\Response
     */
    public function create()
    {
        return view('orders.create');
    }

    /**
     * Store a newly created resource in storage.
     *
     * @param  \Illuminate\Http\Request  $request
     * @return \Illuminate\Http\Response
     */
    public function store(Request $request)
    {
        $purchasetransactions = Purchasetransactions::create($request->only('products_code','name'));
        return redirect(route('orders.index'));
    }

    /** Auto Complete */
    public function productSearch(Request $request){
        $query = $request->get('term','');
        $products=\DB::table('products');
        if($request->type=='product_code'){
            $products->where('product_code','LIKE','%'.$query.'%');
        }
        if($request->type=='product_name'){
            $products->where('name','LIKE','%'.$query.'%');
        }
        $products=$products->get();        
        $data=array();
        foreach ($products as $product) {
            $data[]=array('product_code'=>$product->product_code,'name'=>$product->name);
        }
        if(count($data))
            return $data;
        else
            return ['product_code'=>'','name'=>''];
    }

}

[create.blade]

<div class="container">
        {!! Form::open(array('route'=>'orders.store')) !!}

        <table class="table table-bordered">
          <tr>
              <th><input class='check_all' type='checkbox' onclick="select_all()"/></th>
              <th>S. No</th>
              <th>Product Code</th>
              <th>product name</th>
          </tr>
          <tr>
              <td><input type='checkbox' class='chkbox'/></td>
              <td><span id='sn'>1.</span></td>
              <td><input class="form-control autocomplete_txt" type='text' data-type="product_code" id='product_code_1' name='product_code[]'/></td>
              <td><input class="form-control autocomplete_txt" type='text' data-type="product_name" id='product_name_1' name='product_name[]'/> </td>
            </tr>
          </table>
          <button type="button" class='btn btn-danger delete'>- Delete</button>
          <button type="button" class='btn btn-success addbtn'>+ Add More</button>
      {!! Form::close() !!}
    </div>
    <script type="text/javascript">
     $(".delete").on('click', function() {
      $('.chkbox:checkbox:checked').parents("tr").remove();
      $('.check_all').prop("checked", false); 
      updateSerialNo();
    });
    var i=$('table tr').length;
    $(".addbtn").on('click',function(){
      count=$('table tr').length;
        var data="<tr><td><input type='checkbox' class='chkbox'/></td>";
          data+="<td><span id='sn"+i+"'>"+count+".</span></td>";
          data+="<td><input class='form-control autocomplete_txt' type='text' data-type='product_code' id='product_code_"+i+"' name='product_code[]'/></td>";
          data+="<td><input class='form-control autocomplete_txt' type='text' data-type='product_name' id='product_name_"+i+"' name='product_name[]'/></td></tr>";
      $('table').append(data);
      i++;
    });

    function select_all() {
      $('input[class=chkbox]:checkbox').each(function(){ 
        if($('input[class=check_all]:checkbox:checked').length == 0){ 
          $(this).prop("checked", false); 
        } else {
          $(this).prop("checked", true); 
        } 
      });
    }
    function updateSerialNo(){
      obj=$('table tr').find('span');
      $.each( obj, function( key, value ) {
        id=value.id;
        $('#'+id).html(key+1);
      });
    }
    //autocomplete script
    $(document).on('focus','.autocomplete_txt',function(){
      type = $(this).data('type');

      if(type =='product_code' )autoType='product_code'; 
      if(type =='product_name' )autoType='name'; 

       $(this).autocomplete({
           minLength: 0,
           source: function( request, response ) {
                $.ajax({
                    url: "{{ route('productsearch') }}",
                    dataType: "json",
                    data: {
                        term : request.term,
                        type : type,
                    },
                    success: function(data) {
                        var array = $.map(data, function (item) {
                           return {
                               label: item[autoType],
                               value: item[autoType],
                               data : item
                           }
                       });
                        response(array)
                    }
                });
           },
           select: function( event, ui ) {
               var data = ui.item.data;           
               id_arr = $(this).attr('id');
               id = id_arr.split("_");
               elementId = id[id.length-1];
               $('#product_code_'+elementId).val(data.product_code);
               $('#product_name_'+elementId).val(data.name);
           }
       });
    });
    </script>

[route]

Route :: get( '/orders/create','PurchasetransactionsController@create')->name('orders.create');Route :: get ('productsearch', ['as' => 'productsearch', 'использует' => 'PurchasetransactionsController @ productsearch']);

1 Ответ

0 голосов
/ 19 февраля 2019

Я добавил несколько автозаполненных поисков в поля ввода в laravel, и мне всегда приходилось просматривать их каждый раз, когда я их реализовывал.Это работает для меня.Вот входные данные, которые я ищу для поиска соответствующих сокращений в моем поиске

 <div class="input-group">
     @if(isset($_GET['variable_name']))
         <input value="{{$_GET['variable_name']}}" type="search" name="variable_name" class="form-control" id="variable_name" autocomplete="off">
    @else
        <input type="search" name="variable_name" class="form-control" id="variable_name" placeholder="Search" autocomplete="off">
   @endif
</div>

Скрипт для управления возвратом ajax:

$(document).ready(function($) {
    // Set the Options for "Bloodhound" suggestion engine
    var engine = new Bloodhound({
        remote: {
            url: '/find?variable_name=%QUERY%',
            wildcard: '%QUERY%'
        },
        datumTokenizer: Bloodhound.tokenizers.whitespace('variable_name'),
        queryTokenizer: Bloodhound.tokenizers.whitespace
    });

    $('#variable_name').typeahead({
        hint: true,
        highlight: true,
        minLength: 1
    }, {
        name: 'abbreviations',
        source: engine,
        display: function(data) {
            console.log(data);
            return data.abbreviation  //Input value to be set when you select a suggestion.
        },
        templates: {
            empty: [
                '<div class="list-group search-results-dropdown"><div class="list-group-item">Nothing found.</div></div>'
            ],
            header: [
                '<div class="list-group search-results-dropdown">'
            ],
            suggestion: function(data) {
                return '<div style="font-weight:normal; margin-top:-10px ! important;" class="list-group-item">' + data.abbreviation + ' ' + data.table + '</div></div>'
            }
        }
    });
});

Функция контроллера

public function find(Request $request) {

    $result=Abbreviation::where('abbreviation', 'LIKE', "%{$request->input('variable_name')}%")
        ->orWhere('name', 'LIKE', "%{$request->input('variable_name')}%")->get();
    return response()->json($result);

}

Мой маршрут:

Route::get('/find', 'PagesController@find')->name('typeahead.search');

библиотеки:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Также нужны bloodhound.js и tyepahead.jquery

...