Блог

Главная - Вопросы по программированию - Как отправить выпадающее выбранное значение через вызов ajax контроллеру в laravel

Как отправить выпадающее выбранное значение через вызов ajax контроллеру в laravel

#php #ajax #laravel #controller #laravel-8

Вопрос:

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

Например: Если я выбираю значение параметра 1-го пластикового изделия из раскрывающегося списка, то в контроллере из объекта запроса я хочу, чтобы это выбранное название продукта

в соответствии с приведенным ниже кодом я получаю значение null в объекте запроса названия продукта

Вот мой маршрут:

Route::get('product', 'ProductController@index')->name('product');

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

 
    public function index(Request $request)
        {
            if (isset($request->productName)) {
                $productName = $request->productName;
                dump($productName); // getting null
            } else {
                $productName = null;
            }
            return view('Product.product');
        }

Вот мой вызов ajax:

 
    function display(productName){
            productName = $('#product_filter').val(); // Here, I'm getting selected value of dropdown 
            $.ajax({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            url: "{{route('product')}}",
            type: "GET",
            data:{
                'productName' : productName // in header request I'm getting value [productName: plastic product] *
                },
            success:function(data){
                console.log(data);
            },
            error:function(e){
                console.log(e,'error');
            }
        });
        }

результат запроса заголовка
Результат

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

Комментарии:

1. Я считаю, что вы не можете просто {{ route('dashboard-product-data') }} использовать javascript, так как он не знает, как его анализировать. Пожалуйста, проверьте свою панель ответов и посмотрите, что вы получаете по URL-адресу.

2. @Ryoko, Спасибо, что ответили в соответствии с вашим предложением, я проверил панель ответов, это то, что я получаю в URL url: "http://localhost.product.com/dashboard/product-data" , Не могли бы вы, пожалуйста, помочь мне с этим, как я могу это проанализировать?

3. Ладно, похоже, это работает. Попытайтесь измениться isset с $request->has('productName') и dump до dd . Что ты получаешь?

4. @ryoko я получаю ноль, пока dd();

5. @Ryoko, я внес почти все изменения для этого, и половина вечера прошла, чтобы получить это, не могли бы вы, пожалуйста, помочь мне с этим?

Ответ №1:

Я считаю, что вы получили null , потому что возвращаете полный HTML-код в запрос Ajax. Чтобы получить полезную нагрузку, отправленную из Ajax, вы должны вернуть ответ JSON, подобный этому:

 public function index(Request $request)
{
    $productName = null;

    if (isset($request->productName)) {
        $productName = $request->productName;
    }

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

Тем не менее, я не могу воспроизвести проблему, не увидев, как вы вызываете метод и куда бы вы показали данные. И я предполагаю, что вы хотите просто сделать console.log(data) то, что вы сделали в данном фрагменте. В этом случае приведенный выше фрагмент будет работать.

И если вы хотите сохранить представление, чтобы предотвратить ошибку при обновлении страницы, просто добавьте новый метод для этого конкретного вызова в своем контроллере и отправьте запрос на эту конечную точку, вот так:

web.php 

 <?php

Route::get('/', [ProductController::class, 'index']);
Route::get('/productFilter', [ProductController::class, 'productFilter'])->name('dashboard-product-data');

ProductController.php 

 <?php

namespace AppHttpControllers;

use IlluminateHttpRequest;

class ProductController extends Controller
{
    public function index(Request $request)
    {
        return view('welcome');
    }

    public function productFilter(Request $request)
    {
        $productName = null;

        if (isset($request->productName)) {
            $productName = $request->productName;
        }

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

welcome.blade.php 

 <div>Product Name: <span id="product-name"></span></div>
<select id="product_filter" name="product_filter">
    <option value="plastic product">plastic product</option>
</select>

<button id="submit-button" type="button">Send data</button>

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj 3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script>
    function display(productName){
        productName = $('#product_filter').val(); // Here, I'm getting selected value of dropdown 
        $.ajax({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            url: "{{route('dashboard-product-data')}}",
            type: "GET",
            data:{
                'productName' : productName // in header request I'm getting value [productName: plastic product] *
                },
            success:function(data){
                console.log(data);
                document.querySelector('#product-name').innerHTML = data
            },
            error:function(e){
                console.log(e,'error');
            }
        });
    }

    const submitButton = document.querySelector('#submit-button')
    submitButton.addEventListener('click', () => display())
</script>
Метки: