title: How to store data automatically after some seconds in laravel using ajax?
body: <p>I have created the article post section in my project. In post article i want to store data automatically save as drft in my articles table.
  Here I have put the blade file with form and ajax code. This ajax code is not working means nothing is happening in background. When I enter title no data is stored and when I open console and check it only works string running. plz see this link also  <a href="https://imgur.com/9MGxojj" rel="nofollow noreferrer">https://imgur.com/9MGxojj</a></p>
  
  <pre><code>&lt;form action="{{ route('articles.store') }}" method="POST" enctype='multipart/form-data'&gt;
    @csrf
  
    &lt;div class="card shadow"&gt;
     &lt;div class="card-body pt-3"&gt;
      &lt;div class="row"&gt;
        &lt;div class="col-xs-9 col-sm-9 col-md-9"&gt;
          &lt;div class="form-group"&gt;
            &lt;div &gt;
              &lt;input id="title" type="text" placeholder="Enter title here" class="form-control form--control{{ $errors-&gt;has('title') ? ' is-invalid' : '' }}" name="title" value="{{ old('title') }}"&gt;
              @if ($errors-&gt;has('title'))
              &lt;span class="invalid-feedback" role="alert"&gt;
                &lt;strong&gt;{{ $errors-&gt;first('title') }}&lt;/strong&gt;
              &lt;/span&gt;
              @endif
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="form-group"&gt;
            &lt;div&gt;
             &lt;textarea name="description" id="mytextarea"  class="form-control textarea {{ $errors-&gt;has('description') ? ' is-invalid' : '' }}" placeholder="Description"&gt;{{old('description')}}&lt;/textarea&gt;
  
             @if ($errors-&gt;has('description'))
             &lt;span class="invalid-feedback" role="alert"&gt;
              &lt;strong&gt;{{ $errors-&gt;first('description') }}&lt;/strong&gt;
            &lt;/span&gt;
            @endif
          &lt;/div&gt;
        &lt;/div&gt;
  
      &lt;/div&gt;    &lt;div class="col-xs-3 col-sm-3 col-md-3"&gt;
  
        &lt;div class="card"&gt;
         &lt;div class="card-body"&gt;
  
  
           &lt;div class="form-group"&gt;
            &lt;label for="category_id"&gt;Choose category:&lt;/label&gt;
            &lt;select name="category_id" id="category_id" class="form-control @error('category_id') is-invalid @enderror"  value="{{ old('category_id') }}"   &gt;
              &lt;option value="0"&gt;Select Category&lt;/option&gt;
              @foreach($category as $category)
              &lt;option value="{{$category-&gt;id}}"&gt;{{$category-&gt;name}}&lt;/option&gt;
              @endforeach
            &lt;/select&gt;
            @error('category_id')
            &lt;span class="invalid-feedback" role="alert"&gt;
              &lt;strong&gt;{{ $message }}&lt;/strong&gt;
            &lt;/span&gt;
            @enderror
  
          &lt;/div&gt;
          &lt;div class="form-group"&gt;
            &lt;label for="subcategory_id"&gt;Sub category:&lt;/label&gt;
            &lt;select id="subcategory_id" name="subcategory_id" class="form-control"&gt;
  
            &lt;/select&gt;
  
          &lt;/div&gt; 
  
  
  
          &lt;div class="form-group"&gt;
            &lt;small&gt;Publish Date&lt;/small&gt;
  
            &lt;div&gt;
              &lt;input id="datepicker" type="text" class=" py-2 form-control{{ $errors-&gt;has('show_date') ? ' is-invalid' : '' }}" name="show_date" value="@if(old('show_date')=="") {{date('Y-m-d')}} @else {{ old('show_date') }} @endif"&gt;
              @if ($errors-&gt;has('show_date'))
              &lt;span class="invalid-feedback" role="alert"&gt;
                &lt;strong&gt;{{ $errors-&gt;first('show_date') }}&lt;/strong&gt;
              &lt;/span&gt;
              @endif
            &lt;/div&gt;
          &lt;/div&gt;
  
  
          &lt;div class="form-group"&gt;
            &lt;div&gt;
              &lt;small&gt;Featured image&lt;/small&gt;
              &lt;input id="image"  name="image"  type="file" class="form-control {{ $errors-&gt;has('image') ? ' is-invalid' : '' }}" value="{{ old('image') }}"&gt;
              @if ($errors-&gt;has('image'))
              &lt;span class="invalid-feedback" role="alert"&gt;
                &lt;strong&gt;{{ $errors-&gt;first('image') }}&lt;/strong&gt;
              &lt;/span&gt;
              @endif
            &lt;/div&gt;
          &lt;/div&gt;  
  
  
  
        &lt;/div&gt;
      &lt;/div&gt;&lt;!-- End Right Col --&gt;
  
  
      &lt;div class="card"&gt;
       &lt;div class="card-body"&gt;
        &lt;strong&gt;Tag :&lt;/strong&gt;
        &lt;section id='outside-of-the-box'&gt;
  
          &lt;aside class='rightSide'&gt;
            &lt;input name='tags' class='tagify--outside form-control' value='' placeholder='write some tags'&gt;
            &lt;small&gt;Tag's with comma separator&lt;/small&gt;
          &lt;/aside&gt;
        &lt;/section&gt;
      &lt;/form&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;a href="{{ route('articles.index') }}" class="btn btn-outline-secondary font-weight-normal mr-2"&gt;Cancel&lt;/a&gt;
  &lt;input type="submit" class="btn btn-primary font-weight-normal px-3" name="publish" value="Publish"&gt;
  &lt;input type="submit" class="btn btn-outline-secondary font-weight-normal mx-2" name="save" value="Save as Draft"&gt;
  &lt;/div&gt;        
  
  &lt;/div&gt;
  
  &lt;/div&gt;&lt;!-- End Row --&gt;
  &lt;/div&gt;
  &lt;/form&gt; 
  
  </code></pre>
  
  <p>This is the scripting ajax code...</p>
  
  <pre><code>&lt;script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"&gt;&lt;/script&gt;
  &lt;script&gt;  
   $(document).ready(function(){  
        function autoSave()  
        {  
             var title = $('#title').val();  
             var description = $('#mytextarea').val();  
             // var category_id = $('#category_id').val();  
             if(title != '' &amp;&amp; description != '')  
             {  
                  $.ajax({  
                       url:"{{url('articles')}}",  
                       method:"POST",  
                       data:{title:title, description:description},  
                       dataType:"text",  
                       success:function(data)  
                       {  
                            // if(data != '')  
                            // {  
                            //      $('#category_id').val(data);  
                            // }  
                            $('#autoSave').text("Post save as draft");  
                            setInterval(function(){  
                                 $('#autoSave').text('');  
                            }, 3000);  
                       },
  
                  });  
             }            
        }  
        setInterval(function(){   
             autoSave();   
             }, 3000);  
   });  
   &lt;/script&gt;
  </code></pre>
  
  <p>This is my resource route</p>
  
  <pre><code>This is my resource route
  Route::resource('articles','ArticleController');
  
  datatabel column fields are
  
  title
  description
  category_id
  show_date
  slug
  draft
  </code></pre>