質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

0回答

1258閲覧

DataTables 独自検索関数の追加

jona3

総合スコア5

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2020/05/02 08:19

DataTablesに期間検索の独自関数を追加したい

発生している問題・エラーメッセージ

laravelデータテーブルのパッケージをインストールしてDataTablesの実装をしています。
基本部分は実装できましたが、独自関数がうごきません...

エラーメッセージなし

該当のソースコード

<div class="container"> <div class="row py-5 mt-4"> <table id="table-sort" class="table table-bordered table-hover bg-light border-success col-10 offset-1"> <thead> <tr class="table-active"> <th class="w-25">{{ __('問診票/予診票') }}</th> <th class="w-15">{{ __('お名前') }}</th> <th class="w-15">{{ __('生年月日') }}</th> <th class="w-25 py-1">{{ __('作成日') }}<input type="date" id="period-start" class="period-input" value="{{ $today }}"><input type="date" id="period-end" class="period-input" value="{{ $today }}"></th> <th class="w-10 text-center">{{ __('診察 ') }}<input type="checkbox" id="medical_confirm_check" value=""></th> <th class="w-10 text-center">{{ __('詳細') }}</th> </tr> </thead> </table> </div> </div> <div class="today d-none" data-today={{ $today }}></div> <!-- jQuery --> <script src="//code.jquery.com/jquery.js"></script> <!-- DataTables --> <script src="//cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script> <!-- moment.js --> <script src="http://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.2/moment.min.js"></script> <script> var $dataTable = $.noConflict(true); (function($) { $.fn.dataTable.ext.search.push(function(settings, data, dataIndex){ var start = $('#period-start').val(); var end = $('#period-end').val(); console.log('通過B'); var createdAt = data[3]; if( ( start == "" || end == "" ) || (moment(createdAt).isSameOrAfter(start) && moment(createdAt).isSameOrBefore(end) )){ return true; } return false; }); table = $('#table-sort').DataTable({ 'language': { // 'url': "//cdn.datatables.net/plug-ins/3cfcc339e89/i18n/Japanese.json" "processing": "処理中...", "lengthMenu": "_MENU_ 件表示", "zeroRecords": "データはありません。", "info": " _TOTAL_ 件中 _START_ から _END_ まで表示", "infoEmpty": " 0 件中 0 から 0 まで表示", "infoFiltered": "(全 _MAX_ 件より抽出)", "infoPostFix": "", "search": "検索 ", "url": "", "paginate": { "first": "先頭", "previous": "<前", "next": "次>", "last": "最終" } }, processing: true, displayLength: 50, order: [[ 3, "desc" ]], searching: true, serverSide: true, ajax: '{{ route('admin.index') }}', columns: [ { data: 'sheet_title', name: 'sheet_title', className: '', orderable: false }, { data: 'name', name: 'name', className: '' }, { data: 'birthday', name: 'birthday', className: '' }, { data: 'created_at', name: 'created_at', className: '' }, { data: 'confirm', name: 'confirm', className: 'text-center', search: "診察済", orderable: false }, { data: 'show', name: 'show', className: 'text-center', orderable: false } ] }); $(function(){ var today = $('.today').data('today'); table.column(3).search(today).draw(); table.column(4).search("未診察").draw(); }); $(document).on('change', '.period-input', function() { console.log('通過A'); table.draw(); }); $(document).on("click", '#medical_confirm_check', function() { if($('#medical_confirm_check').prop('checked') == true) { table.column(4).search("診察済").draw(); } else { table.column(4).search("未診察").draw(); } }); })($dataTable); </script>

試したこと

デバッグすると'通過A'は表示されますが、'通過B'は表示されません...
よろしくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問