Skip to content

Commit

Permalink
Merge pull request ant-design#6370 from loganpowell/translation
Browse files Browse the repository at this point in the history
advanced search translation
  • Loading branch information
afc163 authored Jun 15, 2017
2 parents 9cf1d72 + 975b25f commit 7e2828d
Showing 1 changed file with 55 additions and 0 deletions.
55 changes: 55 additions & 0 deletions docs/pattern/advanced-search.en-US.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
---
Order: 6
Title:
  En: Advanced Search
  En-US: Advanced Search
---

With Advanced Search, users can narrow down the range of complex lists / tables.

---

## Conventions

### Interaction

<img class="preview-img" align="right" alt="Interactive examples" description="While in a stowed state, a user clicks Advanced Search to expand search options; if the user has previously entered a query, it's a best practice to transfer the corresponding value to the input box." src="https://os.alipayobjects.com/rmsportal/NpRKspdYRDwsKnw.png">

Conventionally used with deep tables, suitable for search conditions as well as searching for a number of unknown values ​​within a range.

Advanced search is generally used by intermediate / expert users, typically by clicking advanced search. If you are displaying complex data, you can expand advanced search by default.

<br>

<img class="preview-img" align="right" alt='Interactive examples" description="Place an Alert to show the value that has already been entered; the user can click "Clear" to empty all the input values. Click advanced search to expand Advanced Search again.' src="https://os.alipayobjects.com/rmsportal/gKiZtjopvLufqSP.png">

When an advanced search - with an entered a value - is hidden, you should display the search criteria and values.

### Arrangement

<img class="preview-img" align="right" alt="Arrangement Example" src="https://os.alipayobjects.com/rmsportal/TsdXCWLPIETykye.png">

The order of the search criteria should be the same as the order of the titles in the table, and frequently used search conditions can be placed at the top.

### Specifications

<img class="preview-img" align="right" alt="Specification Example" src="https://os.alipayobjects.com/rmsportal/fuPcwZCYiohhdSt.png">

<img class="preview-img" align="right" alt="Specification Example" src="https://os.alipayobjects.com/rmsportal/bFLUSbwoNoakKYS.png">

- Landscape layout

Try not to place more than three columns of input boxes on one line. All Labels and input boxes should fall on the grid.

- Vertical layout

Use `16px` for vertical margins.


## Field Type

### Interaction

<img class="preview-img" align="right" alt="Interactive Example" src = "https://os.alipayobjects.com/rmsportal/TUxfnHjfTJeKaDq.png">

Field types usually appear at the bottom of the main search box. This is suitable when search conditions and values ​​are relatively small in the display.

0 comments on commit 7e2828d

Please sign in to comment.