Как мне создать ярлык, который отображает скорость продукта, когда продукт выбирается из выпадающего списка, используя ajax в laravel

Question

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

Это мой код ajax.

$('#textbox'+counter).on('change',function(){
    $value=$(this).val();
    $.ajax({
        type : 'get',
        url : '{{URL::to('search')}}',
        data:{'search':$value},
        success:function(data){
        $('#rate'+counter).html(data);
        }
    });
    })
$('#textbox1').on('change',function(){
    $value=$(this).val();
    $.ajax({
        type : 'get',
        url : '{{URL::to('search')}}',
        data:{'search':$value},
        success:function(data){
        $('rate1').html(data);
        }
    });
    })
$.ajaxSetup({ headers: { 'csrftoken' : '{{ csrf_token() }}' } });

Это код текстового поля в javascript.

 var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' + counter);
    newTextBoxDiv.after().html('<select class="input" style="width:70%" name="textbox' +counter+'" id="textbox' + counter +'">@foreach($products as $product)<option>{{$product->item_name}}</option>@endforeach</select><input type="number" class="input" id="rate'+counter+'"><input style="width:30%" type="number" class="input" placeholder="Enter the Quantity" name="qty' + counter + '" id="textbox' + counter + '" min=0 value="">');
    newTextBoxDiv.appendTo("#TextBoxesGroup");
    counter++;

Это функция, которая находит курс.

 public function rateFind(Request $request)
    {
        $rate=Product::where('item_name','=',$request->search)->pluck('rate')->first();
        return Response($rate);
    }

В настоящее время я взял текстовое поле, чтобы взятьзначение.Но это не возвращает курс.

Answer 1

Я объяснил здесь шаг за шагом.

Здесь я использовал название контроллера и модель только для примера, который вы можете заменить на свой контроллер и название модели

В блейд-файле:

Здесь я использовал статический параметр, в раскрывающемся списке вы можете добавить свои динамические параметры

<select id="products">
    <option value="1">Product-1</option>
    <option value="2">Product-2</option>
    <option value="3">Product-3</option>
</select>

<p id="selected_product_price"></p>

В файле маршрута: (web.php)

Route::post('get-product-price', 'ProductController@product_price');

В контроллере:

public function product_price(Request $request){
    $post = $request->all();

    $product = Product::find($post['product_id']);

    return response()->json('product' => $product);
}

В JS код:

$(document).on('change', '#products', function(){

    var baseurl = window.location.protocol + "//" + window.location.host;

    var product_id = $(this).val();

    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

    $.ajax({
        url: baseurl + "/get-product-price",
        type: 'post',
        data: { 
            product_id: product_id
        },
        cache: false,
        success: function(response) { 
           $(document).find('#selected_product_price').html(response.product.price);
        }
    });
});

Answer 2

нам нужна дополнительная информация о том, какие фреймворки javascript вы используете.Первой идеей было бы присвоить метке тег span, внутри которого есть идентификатор.Затем установите событие onchange в поле выбора, которое будет громко указывать цену за ajax.После этого выберите идентификатор и измените цену.Если вы используете Jquery, вы можете использовать $ ('# id'). Text (priceLoadedOverAjax)