Required atribut tidak berfungsi di ajax

ini form view

<form class="form-horizontal group-border-dashed" action="#">
                          <div class="form-group row">
                            <div class="col-sm-7">
                              <h3 class="wizard-title">Data Surat</h3>
                            </div>
                          </div>
                          <div class="form-group row">
                            <label class="col-12 col-sm-3 col-form-label text-left text-sm-right">Nomor</label>
                            <div class="col-12 col-sm-8 col-lg-6">
                              <input class="form-control" type="text" required placeholder="Nomor Surat" id="nomor" name="nomor">
                            </div>
                          </div>
                          <div class="form-group row">
                            <label class="col-12 col-sm-3 col-form-label text-left text-sm-right">Tanggal</label>
                            <div class="col-12 col-sm-8 col-lg-6">
                              <input class="form-control" type="date" required name="tanggal" id="tanggal" placeholder="Tanggal">
                            </div>
                          </div>
                          <div class="form-group row">
                            <label class="col-12 col-sm-3 col-form-label text-left text-sm-right">Tujuan</label>
                            <div class="col-12 col-sm-8 col-lg-6">
                              <Textarea class="form-control" required name="tujuan" id="tujuan" ></Textarea>
                            </div>
                          </div>
                          <div class="form-group row">
                            <div class="offset-sm-2 col-sm-10">
                              <!-- <input type="button" onclick="myFunction()" class="btn btn-secondary btn-space" value="Reset"> -->
                              <button class="btn btn-primary btn-space wizard-next" id="btn_save" type="submit" data-wizard="#wizard1">Selanjutnya</button>
                            </div>
                          </div>
                        </form>

dan ini script js nya

<script type="text/javascript">
        $(document).ready(function() {
            //Save product
            $('#btn_save').on('click', function() {
                var nomor = $('#nomor').val();
                var tanggal = $('#tanggal').val();
                var tujuan = $('#tujuan').val();
                $.ajax({
                    type: "POST",
                    url: "<?php echo site_url('users/bendahara/sp/save')?>",
                    dataType: "JSON",
                    data: {
                        nomor: nomor,
                        tanggal: tanggal,
                        tujuan: tujuan
                    },
                    success: function(data) {
                        $('[name="nomor"]').val("");
                        $('[name="tanggal"]').val("");
                        $('[name="tujuan"]').val("");
                        // show_product();
                    }
                });
                return false;
            });

        });
    </script>

posisi insert sudah bisa kalau click pada sript js diubah submit dengan tujuan required berfungsi. data tidak kesimpan.

intinya required tak berfungsi. ada solusi mungkin dari para master ? terima kasih