JSFiddle - React, Tailwind, and code Playground

HTML

<form id="updatepage">
                  <input id="process" name="process" value="updatepage" type="hidden">
                  <input id="id" name="id" value="1" type="hidden">
                  <table><tr><td>Name</td><td>Title</td></tr>
                  <tr><td><input type='text' name='name' id='name' value='MyName'></td>
                  <td><input type="text" name="title" id="title" value = "MyTitle"></td>
                  </tr>
                  </table>
                  <!-- tools box -->
                  <div class="pull-right box-tools">
                    <button class="btn btn-info btn-sm" data-widget='collapse' data-toggle="tooltip" title="Collapse"><i class="fa fa-minus"></i></button>
                    <button class="btn btn-info btn-sm" data-widget='remove' data-toggle="tooltip" title="Remove"><i class="fa fa-times"></i></button>
                  </div><!-- /. tools -->
                </div><!-- /.box-header -->
                <div class='box-body pad'>
                    <textarea id="editor1" name="editor1" rows="10" cols="80">Lorem ipsum dolor sit amet</textarea>
                    <a class="btn btn-app" id="updater">Save</a>
                  </form>

JavaScript

$(function () {
    $('#updater').on('click', function (e) {
        alert($('#updatepage').serialize());
      e.preventDefault();
      $.ajax({
        type: 'post',
        data: $('#updatepage').serialize(),
        success: function (data) {
            alert(data);
        location.reload();
        }
      });
    });
  });