日付ピッカーを使用してビューで公開フィルターを構成するにはどうすればよいですか?


11

公開フィルターを構成して、ユーザーが作成日(できれば日付ピッカーを使用)でサイトコンテンツをフィルターできるようにするにはどうすればよいですか?

Content:Authored on as filter を使用してみましたが、日付を入力するテキストフィールドにyyyy-mm-dd hh:mm:ss形式で日付/時刻を入力するため、ユーザーが日付を入力するのが難しくなります。エラーが発生しやすくなります。

Drupal 8とDrupal 7 with Views 7.x-3 の違いは何ですか?


「コンテンツ:作成済み」フィルター(異なるフレーバーがあります)の1つを追加して公開してみましたか?
mpdonadio

「コンテンツ:作成済み」フィルターが見つかりません。「コンテンツ:作成者」、「コンテンツリビジョン:作成者」、「分類用語:投稿日」のみを入力してください。
サム

メモリによって行った。「コンテンツ:作成者」は機能しますか?
mpdonadio

「内容:作成者」は、ユーザーがyyyy-mm-dd hh:mm:ss形式で日付を入力するための入力ボックスを提供しますが、これは複雑すぎます。日付、月、年のドロップダウンまたは日付ピッカーを表示する方法は?
サム

3
これはまだサポートされていません。drupal.org/ node / 2648950それが今週8.2.x組み込まれることを期待しています。
mpdonadio

回答:



1

数日前にリリースされた新しいパッチがあり、プロジェクトでテストしたところ、問題なく動作しました。ここに問題があります:

公開されたフィルターで日付を選択するときに、テキストフィールドではなく日付タイプのフォーム要素を使用します

問題/動機

日時公開フィルターを追加するとき、単に日付を選択することはできません-UXが非常に悪い日付を手動で入力する必要があります。

そしてパッチは65番です


1

より良い露出フィルタは、日付のポップアップを含む日付型のフィールド、と統合するモジュール。このモジュールを使用して、日付ポップアップ付きの公開フィルターを簡単に追加できます。

現時点ではベータ版ですが、使用できます。


エンティティAPIを使用してフィールドを追加する場合(BaseFieldDefinitionsを介して)、フィールドAPIの代わりに:BEFは日時フィールドでは機能せず、タイムスタンプでのみ機能します。
aaronbauman

1

そのページのjquery日付ピッカーを依存関係として追加します。 your_theme.libraries.yml

date-picker:
  js:
    script/site-datepicker.js : {}
  dependencies:
    - core/jquery
    - core/jquery.ui.datepicker

site-datepicker.js

Drupal.behaviors.customDatepicker = {
  attach: function (context, settings) {
    jQuery(function () {
      jQuery("#datepicker").datepicker({
        dateFormat: "dd-mm-yy",
        altField: "input[data-drupal-selector=edit-created]",
        altFormat: "yy/mm/dd 23:59:59"
      });
    });
  }
};

views-exposed-form-- views-block-name .html.twig

{% if q is not empty %}
  {#
    This ensures that, if clean URLs are off, the 'q' is added first,
    as a hidden form element, so that it shows up first in the POST URL.
  #}
  {{ q }}
{% endif %}

<input id="datepicker" type="text">
<input data-drupal-selector="edit-created" data-msg-maxlength="This field field has a maximum length of 128." name="created" size="30" maxlength="128" aria-invalid="false" type="hidden">
{{ form|without('created') }}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.