Skip to content

Instantly share code, notes, and snippets.

@imamnurhy

imamnurhy/form-filter.blade.php

Last active December 30, 2024 06:21
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save imamnurhy/1734a8e81adbd00d800e1561d977cfe2 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save imamnurhy/1734a8e81adbd00d800e1561d977cfe2 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. imamnurhy revised this gist Dec 30, 2024. No changes.
  2. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion model-loader.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,5 @@
    <style>
    .modal-loader {
    .modal-loader {
    border: 5px solid #f3f3f3;
    border-radius: 50%;
    border-top: 5px solid #3498db;
  3. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 33 additions and 0 deletions.
    33 changes: 33 additions & 0 deletions model-loader.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,36 @@
    <style>
    .modal-loader {
    border: 5px solid #f3f3f3;
    border-radius: 50%;
    border-top: 5px solid #3498db;
    width: 38px;
    height: 38px;
    -webkit-animation: spin 1s linear infinite;
    /* Safari */
    animation: spin 1s linear infinite;
    }
    /* Safari */
    @-webkit-keyframes spin {
    0% {
    -webkit-transform: rotate(0deg);
    }
    100% {
    -webkit-transform: rotate(360deg);
    }
    }
    @keyframes spin {
    0% {
    transform: rotate(0deg);
    }
    100% {
    transform: rotate(360deg);
    }
    }
    </style>
    <!-- Modal Loader -->
    <div class="modal show" id="modal-loader" tabindex="-1" role="dialog" data-backdrop="static"
    data-keyboard="false">
  4. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 0 additions and 1 deletion.
    1 change: 0 additions & 1 deletion script.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,4 +1,3 @@

    //=== FORM FILTER ===//

    $('#form-filter button[type="submit"]').on('click', function () {
  5. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 0 additions and 1 deletion.
    1 change: 0 additions & 1 deletion formSubmit.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1 +0,0 @@
    ‎‎​
  6. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 1 addition and 122 deletions.
    123 changes: 1 addition & 122 deletions formSubmit.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,122 +1 @@
    $('#form').on('submit', function (e) {
    event.preventDefault();
    const form = $(this);
    const submitButton = form.find('#btn-save');
    const alert = form.find('#alert');

    var url = form.data('url-store');
    var method = $('input[name=_method]').val();
    if (method === 'PATCH') {
    url = $(this).data('url-update').replace(':id', $('#id').val());
    }

    if (form[0].checkValidity() === false) {
    form.addClass('was-validated');
    } else {
    form.find('#alert').html('');
    form.find('#btn-save').attr('disabled', true);

    $.ajax({
    url: url,
    type: 'POST',
    data: new FormData(form[0]),
    contentType: false,
    processData: false,
    beforeSend: function () {
    $('#modal-loader').modal('show');
    form.find('#alert').html('');
    form.find('#btn-save').attr('disabled', true);
    },
    success: function (data) {
    form.find('#alert').html(successMessageFormat(data));
    table.api().ajax.reload();
    },
    error: function (xhr) {
    form.find('#alert').html(errorMessageFormat(xhr));
    form.find('#btn-save').removeAttr('disabled');
    }
    }).done(function () {
    $('#modal-loader').modal('hide');
    form.find('#btn-save').removeAttr('disabled');
    form.find('#btn-cancel').trigger('click');
    }).fail(function () {
    $('#modal-loader').modal('hide');
    form.find('#btn-save').removeAttr('disabled');
    })
    return false;
    }

    form.addClass('was-validated');
    });

    function edit(e) {
    $('#alert').html('');
    $('#form-title').html("Mohon tunggu beberapa saat...");
    $('#form-textAction').html(" Perubahan");
    $('input[name=_method]').val('PATCH');
    $('#btn-cancel').show();

    $.ajax({
    url: $(e).data('url'),
    type: 'GET',
    dataType: 'JSON',
    success: function (data) {
    $('#form-title').html('Edit');
    $('#id').val(data.id);
    $('#name').val(data.name).focus();
    },
    error: function () {
    reload();
    }
    });
    }

    function remove(e) {
    $.confirm({
    title: '',
    content: 'Apakah Anda yakin akan menghapus data ini?',
    icon: 'icon icon-question amber-text',
    theme: 'modern',
    closeIcon: true,
    animation: 'scale',
    type: 'red',
    buttons: {
    ok: {
    text: 'ok!',
    btnClass: 'btn-primary',
    keys: ['enter'],
    action: function () {
    $.ajax({
    url: $(e).data('url'),
    type: 'POST',
    data: {
    '_method': 'DELETE',
    '_token': $('meta[name="csrf-token"]').attr('content')
    },
    success: function (data) {
    table.api().ajax.reload();
    },
    error: function () {
    reload();
    }
    });
    }
    },
    cancel: function () {
    console.log('the user clicked cancel');
    }
    }
    });
    }

    function reset(e) {
    const form = $(e).closest('form');

    form[0].reset();
    form.find('input[name=_method]').val('POST');
    form.find('.select2').val('').trigger('change');
    form.find('#form-title').html("Tambah");
    form.find('#form-textAction').html('');
    form.find('#btn-cancel').hide();
    form.find('#btn-reset').show();
    }
    ‎‎​
  7. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 128 additions and 1 deletion.
    129 changes: 128 additions & 1 deletion script.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,6 @@

    //=== FORM FILTER ===//

    $('#form-filter button[type="submit"]').on('click', function () {
    $('#form-filter').data('url', $(this).data('url'));
    });
    @@ -100,4 +103,128 @@ $('#form-filter').on('submit', function (e) {
    }

    $(this).addClass('was-validated');
    });
    });

    //=== FORM SUBMIT ===//
    $('#form').on('submit', function (e) {
    event.preventDefault();
    const form = $(this);
    const submitButton = form.find('#btn-save');
    const alert = form.find('#alert');

    var url = form.data('url-store');
    var method = $('input[name=_method]').val();
    if (method === 'PATCH') {
    url = $(this).data('url-update').replace(':id', $('#id').val());
    }

    if (form[0].checkValidity() === false) {
    form.addClass('was-validated');
    } else {
    form.find('#alert').html('');
    form.find('#btn-save').attr('disabled', true);

    $.ajax({
    url: url,
    type: 'POST',
    data: new FormData(form[0]),
    contentType: false,
    processData: false,
    beforeSend: function () {
    $('#modal-loader').modal('show');
    form.find('#alert').html('');
    form.find('#btn-save').attr('disabled', true);
    },
    success: function (data) {
    form.find('#alert').html(successMessageFormat(data));
    table.api().ajax.reload();
    },
    error: function (xhr) {
    form.find('#alert').html(errorMessageFormat(xhr));
    form.find('#btn-save').removeAttr('disabled');
    }
    }).done(function () {
    $('#modal-loader').modal('hide');
    form.find('#btn-save').removeAttr('disabled');
    form.find('#btn-cancel').trigger('click');
    }).fail(function () {
    $('#modal-loader').modal('hide');
    form.find('#btn-save').removeAttr('disabled');
    })
    return false;
    }

    form.addClass('was-validated');
    });

    function edit(e) {
    $('#alert').html('');
    $('#form-title').html("Mohon tunggu beberapa saat...");
    $('#form-textAction').html(" Perubahan");
    $('input[name=_method]').val('PATCH');
    $('#btn-cancel').show();

    $.ajax({
    url: $(e).data('url'),
    type: 'GET',
    dataType: 'JSON',
    success: function (data) {
    $('#form-title').html('Edit');
    $('#id').val(data.id);
    $('#name').val(data.name).focus();
    },
    error: function () {
    reload();
    }
    });
    }

    function remove(e) {
    $.confirm({
    title: '',
    content: 'Apakah Anda yakin akan menghapus data ini?',
    icon: 'icon icon-question amber-text',
    theme: 'modern',
    closeIcon: true,
    animation: 'scale',
    type: 'red',
    buttons: {
    ok: {
    text: 'ok!',
    btnClass: 'btn-primary',
    keys: ['enter'],
    action: function () {
    $.ajax({
    url: $(e).data('url'),
    type: 'POST',
    data: {
    '_method': 'DELETE',
    '_token': $('meta[name="csrf-token"]').attr('content')
    },
    success: function (data) {
    table.api().ajax.reload();
    },
    error: function () {
    reload();
    }
    });
    }
    },
    cancel: function () {
    console.log('the user clicked cancel');
    }
    }
    });
    }

    function reset(e) {
    const form = $(e).closest('form');

    form[0].reset();
    form.find('input[name=_method]').val('POST');
    form.find('.select2').val('').trigger('change');
    form.find('#form-title').html("Tambah");
    form.find('#form-textAction').html('');
    form.find('#btn-cancel').hide();
    form.find('#btn-reset').show();
    }
  8. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 122 additions and 0 deletions.
    122 changes: 122 additions & 0 deletions formSubmit.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,122 @@
    $('#form').on('submit', function (e) {
    event.preventDefault();
    const form = $(this);
    const submitButton = form.find('#btn-save');
    const alert = form.find('#alert');

    var url = form.data('url-store');
    var method = $('input[name=_method]').val();
    if (method === 'PATCH') {
    url = $(this).data('url-update').replace(':id', $('#id').val());
    }

    if (form[0].checkValidity() === false) {
    form.addClass('was-validated');
    } else {
    form.find('#alert').html('');
    form.find('#btn-save').attr('disabled', true);

    $.ajax({
    url: url,
    type: 'POST',
    data: new FormData(form[0]),
    contentType: false,
    processData: false,
    beforeSend: function () {
    $('#modal-loader').modal('show');
    form.find('#alert').html('');
    form.find('#btn-save').attr('disabled', true);
    },
    success: function (data) {
    form.find('#alert').html(successMessageFormat(data));
    table.api().ajax.reload();
    },
    error: function (xhr) {
    form.find('#alert').html(errorMessageFormat(xhr));
    form.find('#btn-save').removeAttr('disabled');
    }
    }).done(function () {
    $('#modal-loader').modal('hide');
    form.find('#btn-save').removeAttr('disabled');
    form.find('#btn-cancel').trigger('click');
    }).fail(function () {
    $('#modal-loader').modal('hide');
    form.find('#btn-save').removeAttr('disabled');
    })
    return false;
    }

    form.addClass('was-validated');
    });

    function edit(e) {
    $('#alert').html('');
    $('#form-title').html("Mohon tunggu beberapa saat...");
    $('#form-textAction').html(" Perubahan");
    $('input[name=_method]').val('PATCH');
    $('#btn-cancel').show();

    $.ajax({
    url: $(e).data('url'),
    type: 'GET',
    dataType: 'JSON',
    success: function (data) {
    $('#form-title').html('Edit');
    $('#id').val(data.id);
    $('#name').val(data.name).focus();
    },
    error: function () {
    reload();
    }
    });
    }

    function remove(e) {
    $.confirm({
    title: '',
    content: 'Apakah Anda yakin akan menghapus data ini?',
    icon: 'icon icon-question amber-text',
    theme: 'modern',
    closeIcon: true,
    animation: 'scale',
    type: 'red',
    buttons: {
    ok: {
    text: 'ok!',
    btnClass: 'btn-primary',
    keys: ['enter'],
    action: function () {
    $.ajax({
    url: $(e).data('url'),
    type: 'POST',
    data: {
    '_method': 'DELETE',
    '_token': $('meta[name="csrf-token"]').attr('content')
    },
    success: function (data) {
    table.api().ajax.reload();
    },
    error: function () {
    reload();
    }
    });
    }
    },
    cancel: function () {
    console.log('the user clicked cancel');
    }
    }
    });
    }

    function reset(e) {
    const form = $(e).closest('form');

    form[0].reset();
    form.find('input[name=_method]').val('POST');
    form.find('.select2').val('').trigger('change');
    form.find('#form-title').html("Tambah");
    form.find('#form-textAction').html('');
    form.find('#btn-cancel').hide();
    form.find('#btn-reset').show();
    }
  9. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 47 additions and 1 deletion.
    48 changes: 47 additions & 1 deletion simple-form.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -1 +1,47 @@
    ‎‎​
    <form class="needs-validation" id="form" method="POST" novalidate data-url-store="{{ route($route . 'store') }}" data-url-update="{{ route($route . 'update', ':id') }}">

    @csrf
    @method('POST')

    <input type="text" style="display: none" id="id" name="id" />

    <div id="alert"></div>

    <div class="card">
    <div class="card-header">
    <div class="row">
    <div class="col-md-10">
    <h6>
    <strong>
    <span id="form-title">Tambah </span>
    </strong>
    </h6>
    </div>
    <div class="col-md-2">
    <a href='#' class='btn btn-outline-primary btn-xs float-right' style="display: none;" id="btn-cancel" onclick='reset(this)'>Batal</a>
    </div>
    </div>
    </div>

    <div class="card-body">
    <div class="form-row form-inline">
    <div class="col-md-12">
    <div class="form-group m-1">
    <label for="name" class="col-form-label s-12 col-md-4">
    Nama <span class="text-danger"> *</span>
    </label>
    <input type="text" name="name" id="name" class="form-control r-0 light s-12 col-md-8" autocomplete="off" required />
    </div>
    </div>
    </div>

    <div class="float-right m-1">
    <button type="submit" class="btn btn-primary btn-sm" id="btn-save">
    <i class="icon-save mr-2"></i>
    Simpan <span id="form-textAction"></span>
    </button>
    <input type="reset" value="Reset" class="btn-reset" id="btn-reset" />
    </div>
    </div>
    </div>
    </form>
  10. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions simple-form.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    ‎‎​
  11. imamnurhy renamed this gist Dec 30, 2024. 1 changed file with 0 additions and 0 deletions.
    0 form.blade.php → form-filter.blade.php
    View file
    File renamed without changes.
  12. imamnurhy revised this gist Dec 30, 2024. No changes.
  13. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 13 additions and 1 deletion.
    14 changes: 13 additions & 1 deletion model-loader.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -1 +1,13 @@
    ‎‎​
    <!-- Modal Loader -->
    <div class="modal show" id="modal-loader" tabindex="-1" role="dialog" data-backdrop="static"
    data-keyboard="false">
    <div class="modal-dialog modal-dialog-centered d-flex justify-content-center" role="document">
    <div class="card">
    <div class="card-body p-2">
    <div class="text-center">
    <div class="modal-loader"></div>
    </div>
    </div>
    </div>
    </div>
    </div>
  14. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions model-loader.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    ‎‎​
  15. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 28 additions and 28 deletions.
    56 changes: 28 additions & 28 deletions form.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -67,35 +67,35 @@
    </form>

    <script type="text/javascript">
    $('#filter-btn').on('click', function() {
    table.api().ajax.reload();
    });
    $('#filter-btn').on('click', function() {
    table.api().ajax.reload();
    });
    $('#filter-btn_reset').on('click', function() {
    $('#filter-form').trigger('reset');
    table.api().ajax.reload();
    });
    $('#filter-btn_reset').on('click', function() {
    $('#filter-form').trigger('reset');
    table.api().ajax.reload();
    });
    $('#filter-dari_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    maxDate: $('#filter-sampai_tanggal').val() ? $('#filter-sampai_tanggal').val() :
    false
    })
    },
    });
    $('#filter-dari_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    maxDate: $('#filter-sampai_tanggal').val() ? $('#filter-sampai_tanggal').val() :
    false
    })
    },
    });
    $('#filter-sampai_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    minDate: $('#filter-dari_tanggal').val() ? $('#filter-dari_tanggal').val() : false
    })
    },
    });
    $('#filter-sampai_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    minDate: $('#filter-dari_tanggal').val() ? $('#filter-dari_tanggal').val() : false
    })
    },
    });
    </script>
  16. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 28 additions and 28 deletions.
    56 changes: 28 additions & 28 deletions form.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -67,35 +67,35 @@
    </form>

    <script type="text/javascript">
    $('#filter-btn').on('click', function() {
    table.api().ajax.reload();
    });
    $('#filter-btn').on('click', function() {
    table.api().ajax.reload();
    });
    $('#filter-btn_reset').on('click', function() {
    $('#filter-form').trigger('reset');
    table.api().ajax.reload();
    });
    $('#filter-btn_reset').on('click', function() {
    $('#filter-form').trigger('reset');
    table.api().ajax.reload();
    });
    $('#filter-dari_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    maxDate: $('#filter-sampai_tanggal').val() ? $('#filter-sampai_tanggal').val() :
    false
    })
    },
    });
    $('#filter-dari_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    maxDate: $('#filter-sampai_tanggal').val() ? $('#filter-sampai_tanggal').val() :
    false
    })
    },
    });
    $('#filter-sampai_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    minDate: $('#filter-dari_tanggal').val() ? $('#filter-dari_tanggal').val() : false
    })
    },
    });
    $('#filter-sampai_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    minDate: $('#filter-dari_tanggal').val() ? $('#filter-dari_tanggal').val() : false
    })
    },
    });
    </script>
  17. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 28 additions and 28 deletions.
    56 changes: 28 additions & 28 deletions form.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -67,35 +67,35 @@
    </form>

    <script type="text/javascript">
    $('#filter-btn').on('click', function() {
    table.api().ajax.reload();
    });
    $('#filter-btn').on('click', function() {
    table.api().ajax.reload();
    });
    $('#filter-btn_reset').on('click', function() {
    $('#filter-form').trigger('reset');
    table.api().ajax.reload();
    });
    $('#filter-btn_reset').on('click', function() {
    $('#filter-form').trigger('reset');
    table.api().ajax.reload();
    });
    $('#filter-dari_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    maxDate: $('#filter-sampai_tanggal').val() ? $('#filter-sampai_tanggal').val() :
    false
    })
    },
    });
    $('#filter-dari_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    maxDate: $('#filter-sampai_tanggal').val() ? $('#filter-sampai_tanggal').val() :
    false
    })
    },
    });
    $('#filter-sampai_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    minDate: $('#filter-dari_tanggal').val() ? $('#filter-dari_tanggal').val() : false
    })
    },
    });
    $('#filter-sampai_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    minDate: $('#filter-dari_tanggal').val() ? $('#filter-dari_tanggal').val() : false
    })
    },
    });
    </script>
  18. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 101 additions and 1 deletion.
    102 changes: 101 additions & 1 deletion form.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -1 +1,101 @@
    ‎‎​
    <form id="form-filter" method="POST">
    @csrf
    @method('POST')

    <div id="alert"></div>
    <div class="row col-md-12 mt-1 mb-2">
    <div class="col-md-1 p-1">
    <div class="mt-3 ml-1 float-right">
    <strong><i class="icon-filter"></i> FILTER </strong>
    </div>
    </div>

    <div class="column col-md-9">
    <div class="form-row m-2">
    <div class="col-md-6">
    <div class="form-group m-1">
    <label for="filter-dari_tanggal" class="col-form-label s-12">
    Dari Tanggal
    </label>
    <div class="input-group">
    <input name="dari_tanggal" class="form-control date-time-picker"
    id="filter-dari_tanggal" value="{{ date('Y-m-01') }}" />
    <span class="input-group-append">
    <span class="input-group-text add-on white">
    <i class="icon-calendar"></i>
    </span>
    </span>
    </div>
    </div>
    </div>

    <div class="col-md-6">
    <div class="form-group m-1">
    <label for="filter-sampai_tanggal" class="col-form-label s-12">
    Sampai Tanggal
    </label>
    <div class="input-group">
    <input name="sampai_tanggal" class="form-control date-time-picker"
    id="filter-sampai_tanggal" value="{{ date('Y-m-d') }}" />
    <span class="input-group-append">
    <span class="input-group-text add-on white">
    <i class="icon-calendar"></i>
    </span>
    </span>
    </div>
    </div>
    </div>
    </div>
    </div>

    <div class="col-md-2 p-1 mt-3">
    <div class="row">
    <div class="col-10 p-1 d-flex">
    <button type="button" class="btn btn-primary btn-sm col-12"
    title="Cari data" id="filter-btn">
    <i class="icon-search mr-1"></i>Cari data
    </button>
    </div>
    <div class="col-2 m-0 p-0 d-flex justify-content-center align-items-center">
    <a id="filter-btn_reset" title="Reset Filter">
    <i class="icon-history s-24"></i>
    </a>
    </div>
    </div>
    </div>
    </div>
    </form>

    <script type="text/javascript">
    $('#filter-btn').on('click', function() {
    table.api().ajax.reload();
    });
    $('#filter-btn_reset').on('click', function() {
    $('#filter-form').trigger('reset');
    table.api().ajax.reload();
    });
    $('#filter-dari_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    maxDate: $('#filter-sampai_tanggal').val() ? $('#filter-sampai_tanggal').val() :
    false
    })
    },
    });
    $('#filter-sampai_tanggal').datetimepicker({
    format: 'Y-m-d',
    timepicker: false,
    datepicker: true,
    onShow: function(ct) {
    this.setOptions({
    minDate: $('#filter-dari_tanggal').val() ? $('#filter-dari_tanggal').val() : false
    })
    },
    });
    </script>
  19. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions form.blade.php
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    ‎‎​
  20. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion script.js
    View file
    Original file line number Diff line number Diff line change
    @@ -100,4 +100,4 @@ $('#form-filter').on('submit', function (e) {
    }

    $(this).addClass('was-validated');
    });
    });
  21. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 0 additions and 28 deletions.
    28 changes: 0 additions & 28 deletions script.js
    View file
    Original file line number Diff line number Diff line change
    @@ -101,31 +101,3 @@ $('#form-filter').on('submit', function (e) {

    $(this).addClass('was-validated');
    });


    function reload() {
    $.confirm({
    title: '',
    content: 'Terdapat kesalahan saat pengiriman data, Segarkan halaman ini?',
    icon: 'icon icon-all_inclusive',
    theme: 'supervan',
    closeIcon: true,
    animation: 'scale',
    type: 'orange',
    autoClose: 'ok|10000',
    escapeKey: 'cancelAction',
    buttons: {
    ok: {
    text: "ok!",
    btnClass: 'btn-primary',
    keys: ['enter'],
    action: function () {
    document.location.reload();
    }
    },
    cancel: function () {
    console.log('the user clicked cancel');
    }
    }
    });
    }
  22. imamnurhy revised this gist Dec 30, 2024. 1 changed file with 131 additions and 1 deletion.
    132 changes: 131 additions & 1 deletion script.js
    View file
    Original file line number Diff line number Diff line change
    @@ -1 +1,131 @@
    ‎‎​
    $('#form-filter button[type="submit"]').on('click', function () {
    $('#form-filter').data('url', $(this).data('url'));
    });

    $('#form-filter').on('submit', function (e) {
    if ($(this)[0].checkValidity() === false) {
    e.preventDefault();
    e.stopPropagation();
    } else {
    $('#form-filter button[type="submit"]').attr('disabled', true);
    $.ajax({
    url: $(this).data('url'),
    type: 'POST',
    data: new FormData($(this)[0]),
    contentType: false,
    processData: false,
    beforeSend: function () {
    setTimeout(function () {
    $('#modal-loader').modal('show');
    }, 100);
    },
    xhr: function () {
    var xhr = new XMLHttpRequest();
    xhr.responseType = 'blob';
    return xhr;
    },
    success: function (response, status, xhr) {
    var filename = "";
    var disposition = xhr.getResponseHeader('Content-Disposition');

    // Mencari nama file dari header Content-Disposition
    if (disposition && disposition.indexOf('attachment') !== -1) {
    var filenameRegex = /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/;
    var matches = filenameRegex.exec(disposition);
    if (matches != null && matches[1]) filename = matches[1].replace(/['"]/g, '');
    }

    // Mendapatkan tipe konten dari respons
    var contentType = xhr.getResponseHeader('Content-Type');
    var blob = new Blob([response], { type: contentType });

    // Penanganan berdasarkan jenis konten
    if (contentType.toLowerCase().indexOf('application/pdf') !== -1) {
    // Jika tipe konten adalah PDF, buka tab baru untuk melihat PDF
    var fileUrl = window.URL ? window.URL.createObjectURL(blob) : window.webkitURL.createObjectURL(blob);
    window.open(fileUrl, '_blank');
    } else {
    // Jika bukan PDF, lakukan proses unduhan
    if (typeof window.navigator.msSaveBlob !== 'undefined') {
    // Internet Explorer
    window.navigator.msSaveBlob(blob, filename);
    } else {
    // Bukan Internet Explorer
    var downloadUrl = window.URL ? window.URL.createObjectURL(blob) : window.webkitURL.createObjectURL(blob);

    if (filename) {
    // Gunakan atribut HTML5 <a download> untuk menentukan nama file
    var a = document.createElement("a");
    if (typeof a.download === 'undefined') {
    // Safari tidak mendukung atribut download, navigasi ke URL unduhan
    window.location = downloadUrl;
    } else {
    // Mengatur atribute href dan download, dan melakukan klik pada elemen a
    a.href = downloadUrl;
    a.download = filename;
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
    }
    } else {
    // Jika tidak ada nama file, gunakan URL untuk mengunduh file
    window.location = downloadUrl;
    }

    // Membersihkan URL object setelah beberapa saat
    setTimeout(function () {
    if (window.URL) {
    window.URL.revokeObjectURL(downloadUrl);
    } else {
    window.webkitURL.revokeObjectURL(downloadUrl);
    }
    }, 100);
    }
    }
    },
    error: function (error) {
    alert('Kesalahan Saat Export Data');
    }
    }).done(function () {
    $('#form-filter button[type="submit"]').removeAttr('disabled');
    setTimeout(function () {
    $('#modal-loader').modal('hide');
    }, 1000);
    }).fail(function () {
    $('#form-filter button[type="submit"]').removeAttr('disabled');
    $('#modal-loader').modal('hide');
    })

    return false;
    }

    $(this).addClass('was-validated');
    });


    function reload() {
    $.confirm({
    title: '',
    content: 'Terdapat kesalahan saat pengiriman data, Segarkan halaman ini?',
    icon: 'icon icon-all_inclusive',
    theme: 'supervan',
    closeIcon: true,
    animation: 'scale',
    type: 'orange',
    autoClose: 'ok|10000',
    escapeKey: 'cancelAction',
    buttons: {
    ok: {
    text: "ok!",
    btnClass: 'btn-primary',
    keys: ['enter'],
    action: function () {
    document.location.reload();
    }
    },
    cancel: function () {
    console.log('the user clicked cancel');
    }
    }
    });
    }
  23. imamnurhy created this gist Dec 30, 2024.
    1 change: 1 addition & 0 deletions script.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    ‎‎​