Laravel 5 с Ajax?

Question

У меня есть этот код laravel в моей функции отключения контроллера.

$input = Input::all(); 
    $product= Products::findOrFail($input['product_id']); 
    $product->tags()->detach($input['tag_id']); 
    $product= Products::where('customer_id', Auth::user()->customers_id)->get(); 

    return view('products.tagsdelete', [ 
      'products' => $product, 
     ]); 

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

(Конечно, я мог бы сделать выбор всех тегов пользователь хочет удалить, но я хочу, чтобы это жить с Ajax)

Моя проблема в том, что я не мог найти ничего, что помогает мне с отрядом от laravel + Ajax. Я вполне в порядке с Javascript и JQuery, но Ajax все еще для меня нова.

Так может кто-нибудь мне помочь? Я действительно застрял.

Спасибо, что нашли время :)

@Wiriya Rungruang

текущий код контроллера:

public function detach() 
    { 
    $input = Input::all(); 
    $product= Products::findOrFail($input['product_id']); 
    $product->tags()->detach($input['tag_id']); 
    $product= Products::where('customer_id', Auth::user()->customers_id)->get(); 
} 

моя кнопка:

<button type="submit" class="delete-tag-btn" data-product_id="{{ $product->id }}" data-tag_id="{{ $tag->id }}"><i class="glyphicon glyphicon-trash"></i></button> 

в нижней части коде JS:

<script> 
    $(".delete-tag-btn").on('click', function(){ 
     var url = "{{ route('detach') }}"; // Url to deleteTag function 
     url += "product_id=" + $(this).data('product_id'); 
     url += "&tag_id=" + $(this).data('tag_id'); 

     // Now url should look like this 'http://localhost/deletetag?product_id=2&tag_id=5 
     // Send get request with url to your server 
     $.get(url, function(response){ 
      alert("success"); 
     }); 
    }); 
</script> 

Answer 1

Первый: Вы должны создать функцию отсоединения тег из продукта в контроллере и вернуть успех статус или неудачу (или вообще ничего)

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

function detachTag(){ 
    $input = Input::all(); 
    $product= Products::findOrFail($input['product_id']); 
    $product->tags()->detach($input['tag_id']); 
    $product= Products::where('customer_id', Auth::user()->customers_id)->get(); 

    return "Some state for checking it a success or not"; 
} 

Второй: Создайте функцию javascript для проверки, когда вы нажимаете кнопку отправки кнопки «Отправить» с параметром, который мы создали на первом шаге, и перезапустите или удалите этот тег со своей HTML-страницы ** Параметр средняя product_id и tag_id, что хочет, чтобы отделить его

В вашем JS

$(".delete-tag-btn").on('click', function(){ 
    var url = "localhost/deletetag?"; // Url to deleteTag function 
    url += "product_id=" + $(this).data('product_id'); 
    url += "&tag_id=" + $(this).data('tag_id'); 

    // Now url should look like this 'http://localhost/deletetag?product_id=2&tag_id=5 
    // Send get request with url to your server 
    $.get(url, function(response){ 
     // Do what you want 
    }); 
}); 

Итак, когда вы нажимаете на .delete-таг-BTN Он будет посылать запрос на Detach это

Answer 2

в то время как вы можете прямо простой Ajax вызова, передачи данных и возврата HTML и заменить его старой HTML

позволяет начать :)

первый шаг писать Ajax, и отправить его, когда форма отправить или любой нажимается кнопка (в соответствии с вашим кодом)

это один пример Ajax, просто заполните ваши данные в нем.

var BASEURL = window.location.origin + "/your_domain_name/"; 
    $.ajax({ 
        url: BASEURL + "your_route", 
        type: "POST/GET", //any_one 
        data: { 
         // Your data comes here (object) 
        }, 
        beforeSend: function() { 

        }, 
        success: function (response) { 
         console.log(response); // your html in return 
        }, 
        complete: function (response) { 

        } 
       }); 

теперь вызов будет посылать ваши данные контроллера соответствующих по указанному маршруту вы упомянули, обработка будет нормально. Он вернет только html. Вы можете делать все, что хотите, с помощью этого html.

Одна из важных проблем, с которой вы можете столкнуться, если учесть эти инструкции, прямо сейчас представление, которое вы возвращаете, вероятно, имеет целую страницу (поскольку страница обновляется каждый раз), но если вы думаете заменить ее новым html , вам нужно будет только вернуть эту часть страницы, может быть, одна строка или что-то в этом роде. Таким образом, сломайте свой взгляд во многих подзапросах. Php @include(//path) (лезвие) может пригодиться. То, как я использую, чтобы работать. :)