Skip to main content

 

パターン

 

従来のWebアプリにのみ適用されます

 

OutSystems

Search

ユーザーがナビゲーションを使用せずにコンテンツの部分を見つけることができます。

Searchは、エンドユーザーがクエリを入力してコンテンツの部分を簡単に見つけられるようにするために使用します。ナビゲーションとは異なり、コンテンツの場所に関する知識は不要です。

使用方法

1.Searchパターンをプレビューにドラッグします。

![](<images/search-image-1.png>)

1.入力にText型のローカル変数を設定します。

![](<images/search-image-2.png>)

1.パブリッシュしてテストします。

入力パラメータ

入力名 説明 必須 デフォルト値
ExtendedClass このブロックにカスタムスタイルクラスを追加します。 Text No なし

レイアウトおよびクラス

高度なユースケース

検索リセットボタンを作成する

この例については、FourColumns画面テンプレートをご覧ください。

1.Column2のFilters_Wrapperコンテナ内にあるSearchパターンに移動します。 1.コンテナを[Actions]プレースホルダ内にドラッグします。 1.Iconウィジェットをそのコンテナ内にドラッグし、Nameパラメータで「Entities.IconName.times」を選択します。これはXアイコンです。

![](<images/search-image-4.png>)

1.コンテナで、Displayパラメータを「If(SearchKeyword <> "", True, False)」に設定します。これにより、既存のSearchKeywordローカル変数を使用して、検索入力にテキストが含まれる場合にのみコンテナを表示します。

![](<images/search-image-5.png>)

1.OnClickイベントを追加し、RefreshTableアクションにハンドラを設定します。 1.ResetFiltersパラメータとResetPaginationパラメータを[True]に設定します。 1.Categoryプロパティで、ProductCategoryローカル変数を設定します。これにより、検索入力がリセットされ、画面もデフォルトの状態にリセットされます。

![](<images/search-image-6.png>)

1.パブリッシュしてテストします。

![](<images/search-gif-1.gif>)
  • Was this article helpful?