title: upload image and store in database using ajax in php laravel
body: <p>I'm working in php laravel what i want is to upload an image in a form that is used to add new CATEGORY: category name, description and upload image.</p>
  
  <p>my view is as shown:</p>
  
  <pre><code>@extends('layouts.app', ['activePage' =&gt; 'category', 'titlePage' =&gt; __('Category Management')])
  
  @section('content')
  
  @include('modal.editCategory');
  
    &lt;div class="content"&gt;
      &lt;div class="container-fluid"&gt;
        &lt;div class="row"&gt;
          &lt;div class="col-md-12"&gt;
            &lt;form id="categoryForm"&gt;
              @csrf
              @method('post')
  
  
  
              &lt;div class="card "&gt;
                &lt;div class="card-header card-header-primary"&gt;
                  &lt;h4 class="card-title"&gt;{{ __('Add Category') }}&lt;/h4&gt;
                  &lt;p class="card-category"&gt;&lt;/p&gt;
                &lt;/div&gt;
                &lt;div class="card-body "&gt;
                  &lt;div class="row"&gt;
                    &lt;div class="col-md-12 text-right"&gt;
                        &lt;a href="{{ route('getFeed') }}" class="btn btn-sm btn-primary"&gt;{{ __('Back to Feeds') }}&lt;/a&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="row"&gt;
                    &lt;label class="col-sm-2 col-form-label"&gt;{{ __('Name') }}&lt;/label&gt;
                    &lt;div class="col-sm-7"&gt;
                      &lt;div class="form-group{{ $errors-&gt;has('name') ? ' has-danger' : '' }}"&gt;
                        &lt;input class="form-control{{ $errors-&gt;has('name') ? ' is-invalid' : '' }}" name="category" id="category" type="text" placeholder="{{ __('Name') }}" value="" required="true" aria-required="true"/&gt;
  
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;div class="row"&gt;
                    &lt;label class="col-sm-2 col-form-label"&gt;{{ __('Description') }}&lt;/label&gt;
                    &lt;div class="col-sm-7"&gt;
                      &lt;div class="form-group{{ $errors-&gt;has('name') ? ' has-danger' : '' }}"&gt;
                        &lt;textarea class="md-textarea form-control" rows="5" name="desc" id="desc" type="text" placeholder="{{ __('Description') }}" value="" required="true" aria-required="true"&gt;&lt;/textarea&gt;
  
                      &lt;/div&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
  
                &lt;/div&gt;
                &lt;div class="card-footer ml-auto mr-auto"&gt;
                  &lt;button type="button" class="btn btn-primary newCategory"&gt;{{ __('Add Category') }}&lt;/button&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/form&gt;
          &lt;/div&gt;
        &lt;/div&gt;
  
        &lt;div class="card"&gt;
                &lt;div class="card-header card-header-primary"&gt;
                  &lt;h4 class="card-title "&gt;{{ __('Category List') }}&lt;/h4&gt;
                  &lt;p class="card-category"&gt; {{ __('Here you can manage categories') }}&lt;/p&gt;
                &lt;/div&gt;
                &lt;div class="card-body"&gt;
                  @if (session('status'))
                    &lt;div class="row"&gt;
                      &lt;div class="col-sm-12"&gt;
                        &lt;div class="alert alert-success"&gt;
                          &lt;button type="button" class="close" data-dismiss="alert" aria-label="Close"&gt;
                            &lt;i class="material-icons"&gt;close&lt;/i&gt;
                          &lt;/button&gt;
                          &lt;span&gt;{{ session('status') }}&lt;/span&gt;
                        &lt;/div&gt;
                      &lt;/div&gt;
                    &lt;/div&gt;
                  @endif
                  &lt;div class="table-responsive "&gt;
                    &lt;table class="table display responsive nowrap table-striped" id="category-datatable" width="100%" cellspacing="0"&gt;
                      &lt;thead class=" text-primary "&gt;
                      &lt;th&gt;
                            {{ __('No') }}
                        &lt;/th&gt;
                      &lt;th&gt;
                            {{ __('Name') }}
                        &lt;/th&gt;
                        &lt;th&gt;
                            {{ __('Description') }}
                        &lt;/th&gt;
                        &lt;th class="text-right"&gt;
                          {{ __('Actions') }}
                        &lt;/th&gt;
                      &lt;/thead&gt;
                      &lt;tbody&gt;
  
                      &lt;/tbody&gt;
                    &lt;/table&gt;
                  &lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
  
      &lt;/div&gt;
    &lt;/div&gt;
  
  @endsection
  </code></pre>
  
  <p>I used ajax to submit value from view to controller as shown below:</p>
  
  <p>// add category</p>
  
  <pre><code> $('.newCategory').click(function (e) {
  
          e.preventDefault();
          var formData = $("#categoryForm").serialize();
          $('.error-msg').html('');
          $.ajax({
              headers: {
                  'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
              },
              url: baseUrl + 'addCategory',
              type: 'GET',
              data: formData,
              success: function (data) {
                  localStorage.setItem("swal",
                      swal({
                          title: "Success!",
                          text: "Category Added",
                          type: "success",
                          timer: 3000,
                          showConfirmButton: false
                      })
                  );
                  location.reload();
                  localStorage.getItem("swal");
  
  
              }
  
          });
  
      });
  </code></pre>
  
  <p>An this is my controller:</p>
  
  <pre><code>public function addCategory(Request $request)
      {
          $name=$request-&gt;input('category');
          $desc=$request-&gt;input('desc');
          $created_at=Carbon::now();
          $updated_at=Carbon::now();
          $data=array('name'=&gt;$name,'description'=&gt;$desc,'created_at'=&gt;$created_at,'updated_at'=&gt;$updated_at);
          Category::insert($data);
      }
  </code></pre>
  
  <p>Can someone help me with this?</p>