Add more <search> examples

sinsukehlab · Jan 9, 2025 · b8535b2 · b8535b2
1 parent f4b405e
commit b8535b2
Showing 1 changed file with 44 additions and 2 deletions.
diff --git a/NOTE.md b/NOTE.md
@@ -4343,6 +4343,14 @@ You are on my home page. Here you can see a <a href="#">contacts page</a>.
 
 <search>search</search>
 
+<search>
+<form action="./search/">
+<label for="movie">Find a movie</label>
+<input type="search" id="movie" name="q" />
+<button type="submit">Search</button>
+</form>
+</search>
+
 <search>
 <label>
 Search
@@ -4383,6 +4391,20 @@ Exact matches only
 > This is inside <code>&lt;search&gt;</code>.
 > </search>
 
+> [!NOTE]
+> <search>
+> <form action="./search/">
+> <label for="movie">
+> This is inside <code>&lt;search&gt;&lt;form&gt;&lt;label&gt;</code>.
+> Find a movie
+> </label>
+> <input type="search" id="movie" name="q" />
+> <button type="submit">Search</button>
+> </form>
+> </search>
+
+> [!NOTE]<br><search><form action="./search/"><label for="movie">This is inside `<search><form><label>`.<br>Find a movie</label><input type="search" id="movie" name="q" /><button type="submit">Search</button></form></search>
+
 > [!NOTE]
 > <search>
 > <label>
@@ -4403,7 +4425,7 @@ Exact matches only
 > </section>
 > </search>
 
-> [!NOTE]<br><search><label>This is inside `<search><label>`.<br>Search<input type="search" id="query" /></label><br><label><input type="checkbox" id="exact-only" />Exact matches only</label><section><h4>Results:</h4><ul id="results"></ul><output id="no-results"></output></section></search>
+> [!NOTE]<br><search><label>This is inside `<search><label>`.<br>Search<input type="search" id="query" /></label><label><input type="checkbox" id="exact-only" />Exact matches only</label><section><h4>Results:</h4><ul id="results"></ul><output id="no-results"></output></section></search>
 
 ### alerts in `<search>`
 
@@ -4485,6 +4507,26 @@ Exact matches only
 
 <search>
 
-> [!NOTE]<br><label>This is inside `<label>`.<br>Search<input type="search" id="query" /></label><br><label><input type="checkbox" id="exact-only" />Exact matches only</label><section><h4>Results:</h4><ul id="results"></ul><output id="no-results"></output></section>
+> [!NOTE]<br><label>This is inside `<label>`.<br>Search<input type="search" id="query" /></label><label><input type="checkbox" id="exact-only" />Exact matches only</label><section><h4>Results:</h4><ul id="results"></ul><output id="no-results"></output></section>
+
+</search>
+
+<search>
+
+> [!NOTE]
+> <form action="./search/">
+> <label for="movie">
+> This is inside <code>&lt;form&gt;&lt;label&gt;</code>.
+> Find a movie
+> </label>
+> <input type="search" id="movie" name="q" />
+> <button type="submit">Search</button>
+> </form>
+
+</search>
+
+<search>
+
+> [!NOTE]<br><form action="./search/"><label for="movie">This is inside `<form><label>`.<br>Find a movie</label><input type="search" id="movie" name="q" /><button type="submit">Search</button></form>
 
 </search>