Ajax call Laravel Route - ajax

Question

How do I properly call a Laravel Route or Controller in my Ajax?
An error appears and says:
Route [product/create] not defined. (View:
C:\xampp\htdocs\laravel\resources\views\jsBlade\logoInput.blade.php)
(View:
C:\xampp\htdocs\laravel\resources\views\jsBlade\logoInput.blade.php)
My Routes look like this:
# Middleware group if user is successfully logged in
Route::group(['middleware' => 'auth'], function ()
{
Route::get('/home', ['as' => 'home', 'uses' => 'PageController#showHome']);
# Product group
Route::group(['prefix' => 'product'], function ()
{
Route::get('/', ['as' => 'indexProduct', 'uses' => 'ProductController#indexProduct']);
Route::get('new', ['as' => 'newProduct', 'uses' => 'ProductController#newProduct']);
Route::get('show/{productID}', ['as' => 'showProduct', 'uses' => 'ProductController#showProduct']);
Route::get('edit/{productID}', ['as' => 'editProduct', 'uses' => 'ProductController#editProduct']);
Route::post('create', ['as' => 'createProduct', 'uses' => 'ProductController#createProduct']);
Route::post('update', ['as' => 'updateProduct', 'uses' => 'ProductController#updateProduct']);
Route::delete('destroy', ['as' => 'destroyProduct', 'uses' => 'ProductController#destroyProduct']);
});
});
My Ajax:
$("#input-logo").fileinput({
uploadUrl: '{{route("product/create")}}',
type: 'POST',
allowedFileExtensions: ["jpg", "png", "gif", "jpeg"],
allowedFileTypes: ['image'],
headers: {
'X-CSRF-Token': $('#_token').val(),
}
}).on('filepreupload', function() {
$('#kv-success-box').html('');
}).on('fileuploaded', function(event, data) {
$('#kv-success-box').append(data.response.link);
$('#kv-success-modal').modal('show');
});
</script>
Controller
<?php
namespace App\Http\Controllers;
use Input;
use App\Product;
use App\Companies;
use App\Http\Controllers\Controller;
class ProductController extends Controller
{
public function createProduct()
{
$data = Input::all();
$product = new Product;
$product->fill($data);
if($product->save())
{
return redirect()->route('root')->with('message','Success');;
}
}
}
Firefox gives this error message:
SyntaxError: JSON.parse: unexpected character at line 1 column 1 of
the JSON data.

Answer 1

Change this part
uploadUrl: '{{route("product/create")}}',
to this
uploadUrl: '{{url("product/create")}}',
and add a csrf token to your header in ajax
headers: {
'X-CSRF-Token': '{{ csrf_token() }}',
},

Answer 2

Just Ajax to the URL of the route like this:
This is my route:
Route::post('users/send-file-temp',['uses'=>'UsersController#postSendFileTemp']);
and here is my ajax call:
$.ajax({
url: '/users/send-file-temp',
});
Ajax will send the request to /users/send-file-temp and Laravel will recognize the route and direct it to the corresponding controller.

Answer 3

Take not of your ajax method type and your Route method type
Example below
My Ajax code
$('#sendMsg').click(function(e){
e.preventDefault();
$.ajax({
url: '{{url("R_E/users/sendMSG")}}',
data: $("#form-signin").serialize(),
type: "POST",
headers: {
'X-CSRF-Token': '{{ csrf_token() }}',
},
success: function(data){
alert("okay");
},
error: function(){
alert("failure From php side!!! ");
}
});
});
My route Code
Route::post('/users/sendMSG', 'RE\MainController#sendMSG');

Answer 4

instead of {{route("product/create")}} ,
following one worked for me in Laravel 8 :
!{route("product/create")}!