title: How to save in database value with vue js?
body: <p>This calendar is made with vuejs.</p>
  <p><a href="https://i.stack.imgur.com/UpMxZ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/UpMxZ.png" alt="calendar" /></a></p>
  <p>But the problem I have, After selecting the date, it does not store any value in the database.</p>
  <p>I want to store a vuejs component in a database. Is there some sort of serialization procedure/package that I can use to serialize vuejs components?</p>
  <pre><code>&lt;div class=&quot;modal-body&quot;&gt;
      &lt;form method=&quot;post&quot;&gt;
          @csrf
          @method('PUT')
          &lt;input type=&quot;hidden&quot; id=&quot;id&quot;&gt;
          &lt;div class=&quot;row&quot;&gt;
              &lt;div class=&quot;col-md-6 mb-3&quot;&gt;
                  &lt;label for=&quot;edit_start_date&quot;&gt;تاریخ شروع به كار&lt;/label&gt;
                  &lt;date-picker type=&quot;date&quot; id=&quot;edit_start_date&quot; name=&quot;start_date&quot;&gt;&lt;/date-picker&gt;
              &lt;/div&gt;
              &lt;div class=&quot;col-md-6 mb-3&quot;&gt;
                  &lt;label for=&quot;edit_end_date&quot;&gt;تاریخ خاتمه كار&lt;/label&gt;
                  &lt;date-picker type=&quot;date&quot; id=&quot;edit_end_date&quot; name=&quot;end_date&quot;&gt;&lt;/date-picker&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  <p>script</p>
  <pre><code>$(document).on('click', '#jobEdit', function(event) {
      event.preventDefault();
      var id = $(this).data('id');
      $.ajax({
          type:'get',
          url:'/job/'+id+'/edit',
          success:function (data) {
              console.log(data);
              $('#id').val(data.job.id);
              $('#edit_employment_type').val(data.job.employment_type);
              $('#edit_job_type').val(data.job.job_type);
              $('#edit_history').val(data.job.history);
              $('#edit_post_title').val(data.job.post_title);
              $('#edit_state_id').val(data.job.state_id);
              $('#edit_city_id').val(data.job.city_id);
              $('#edit_start_date').val(data.job.start_date);
              $('#edit_end_date').val(data.job.end_date);
          },
      });
  });
  
  $(document).on('click', '#jobUpdate', function(event) {
      event.preventDefault();
      var id = $('#id').val();
      var data = {
          'employment_type' : $('#edit_employment_type').val(),
          'job_type' : $('#edit_job_type').val(),
          'history' : $('#edit_history').val(),
          'post_title' : $('#edit_post_title').val(),
          'state_id' : $('#edit_state_id').val(),
          'city_id' : $('#edit_city_id').val(),
          'start_date' : $('#edit_start_date').val(),
          'end_date' : $('#edit_end_date').val(),
      }
      $.ajax({
          type: 'PUT',
          url: '/job/'+id,
          data: data,
          dataType: 'JSON',
          success: function (response) {
              console.log(response);
              $('#jobModal').modal('hide');
              showJobs();
          },
      });
  });
  </code></pre>