[html5] r8339 - [e] (0) Examples for method='', including method=dialog Fixing https://www.w3.or [...]

whatwg at whatwg.org whatwg at whatwg.org
Tue Dec 10 17:14:30 PST 2013


Author: ianh
Date: 2013-12-10 17:14:29 -0800 (Tue, 10 Dec 2013)
New Revision: 8339

Modified:
   complete.html
   index
   source
Log:
[e] (0) Examples for method='', including method=dialog
Fixing https://www.w3.org/Bugs/Public/show_bug.cgi?id=23434
Affected topics: CSS, HTML

Modified: complete.html
===================================================================
--- complete.html	2013-12-10 22:09:38 UTC (rev 8338)
+++ complete.html	2013-12-11 01:14:29 UTC (rev 8339)
@@ -298,7 +298,7 @@
 
   <header class=head id=head><p><a href=http://www.whatwg.org/ class=logo><img width=101 src=/images/logo alt=WHATWG height=101></a></p>
    <hgroup><h1 class=allcaps>HTML</h1>
-    <h2 class="no-num no-toc">Living Standard — Last Updated 10 December 2013</h2>
+    <h2 class="no-num no-toc">Living Standard — Last Updated 11 December 2013</h2>
    </hgroup><dl><dt><strong>Web developer edition:</strong></dt>
     <dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
     <dt>Multiple-page version:</dt>
@@ -46601,6 +46601,58 @@
   element is a <a href=#concept-submit-button title=concept-submit-button>submit button</a> and has a <code title=attr-fs-formmethod><a href=#attr-fs-formmethod>formmethod</a></code> attribute, then the element's <a href=#concept-fs-method title=concept-fs-method>method</a> is that attribute's state; otherwise, it is the <a href=#form-owner>form
   owner</a>'s <code title=attr-fs-method><a href=#attr-fs-method>method</a></code> attribute's state.</p>
 
+  <div class=example>
+
+   <p>Here the <code title=attr-fs-method><a href=#attr-fs-method>method</a></code> attribute is used to explicitly specify
+   the default value, "<code title=attr-fs-method-GET-keyword><a href=#attr-fs-method-get-keyword>get</a></code>", so that the search
+   query is submitted in the URL:</p>
+
+   <pre><form method="get" action="/search.cgi">
+ <p><label>Search terms: <input type=search name=q></label></p>
+ <p><input type=submit></p>
+</form></pre>
+
+  </div>
+
+  <div class=example>
+
+   <p>On the other hand, here the <code title=attr-fs-method><a href=#attr-fs-method>method</a></code> attribute is used to
+   specify the value "<code title=attr-fs-method-POST-keyword><a href=#attr-fs-method-post-keyword>post</a></code>", so that the user's
+   message is submitted in the HTTP request's body:</p>
+
+   <pre><form method="post" action="/post-message.cgi">
+ <p><label>Message: <input type=text name=m></label></p>
+ <p><input type=submit value="Submit message"></p>
+</form></pre>
+
+  </div>
+
+  <div class=example>
+
+   <p>In this example, a <code><a href=#the-form-element>form</a></code> is used with a <code><a href=#the-dialog-element>dialog</a></code>. The <code title=attr-fs-method><a href=#attr-fs-method>method</a></code> attribute's "<code title=attr-fs-method-dialog-keyword><a href=#attr-fs-method-dialog-keyword>dialog</a></code>" keyword is used to have the dialog
+   automatically close when the form is submitted.</p>
+
+   <pre lang=en-GB><dialog id="ship">
+ <form method=dialog>
+  <p>A ship has arrived in the harbour.</p>
+  <button type=submit value="board">Board the ship</button>
+  <button type=submit value="call">Call to the captain</button>
+ </form>
+</dialog>
+<script>
+ var ship = document.getElementById('ship');
+ ship.showModal();
+ ship.onclose = function (event) {
+   if (ship.returnValue == 'board') {
+     // ...
+   } else {
+     // ...
+   }
+ };
+</script></pre>
+
+  </div>
+
   <hr><p>The <dfn id=attr-fs-enctype title=attr-fs-enctype><code>enctype</code></dfn> and <dfn id=attr-fs-formenctype title=attr-fs-formenctype><code>formenctype</code></dfn> content attributes are <a href=#enumerated-attribute title="enumerated attribute">enumerated attributes</a> with the following keywords and
   states:</p>
 
@@ -51077,7 +51129,7 @@
    <li><p>Remove <var title="">subject</var>'s <code title=attr-dialog-open><a href=#attr-dialog-open>open</a></code>
    attribute.</li>
 
-   <li><p>If the argument was passed a <var title="">result</var>, then set the <code title=dom-dialog-returnValue><a href=#dom-dialog-returnvalue>returnValue</a></code> attribute to the value of <var title="">result</var>.</li>
+   <li><p>If the argument <var title="">result</var> was provided, then set the <code title=dom-dialog-returnValue><a href=#dom-dialog-returnvalue>returnValue</a></code> attribute to the value of <var title="">result</var>.</li>
 
    <li>
 

Modified: index
===================================================================
--- index	2013-12-10 22:09:38 UTC (rev 8338)
+++ index	2013-12-11 01:14:29 UTC (rev 8339)
@@ -298,7 +298,7 @@
 
   <header class=head id=head><p><a href=http://www.whatwg.org/ class=logo><img width=101 src=/images/logo alt=WHATWG height=101></a></p>
    <hgroup><h1 class=allcaps>HTML</h1>
-    <h2 class="no-num no-toc">Living Standard — Last Updated 10 December 2013</h2>
+    <h2 class="no-num no-toc">Living Standard — Last Updated 11 December 2013</h2>
    </hgroup><dl><dt><strong>Web developer edition:</strong></dt>
     <dd><strong><a href=http://developers.whatwg.org/>http://developers.whatwg.org/</a></strong></dd>
     <dt>Multiple-page version:</dt>
@@ -46601,6 +46601,58 @@
   element is a <a href=#concept-submit-button title=concept-submit-button>submit button</a> and has a <code title=attr-fs-formmethod><a href=#attr-fs-formmethod>formmethod</a></code> attribute, then the element's <a href=#concept-fs-method title=concept-fs-method>method</a> is that attribute's state; otherwise, it is the <a href=#form-owner>form
   owner</a>'s <code title=attr-fs-method><a href=#attr-fs-method>method</a></code> attribute's state.</p>
 
+  <div class=example>
+
+   <p>Here the <code title=attr-fs-method><a href=#attr-fs-method>method</a></code> attribute is used to explicitly specify
+   the default value, "<code title=attr-fs-method-GET-keyword><a href=#attr-fs-method-get-keyword>get</a></code>", so that the search
+   query is submitted in the URL:</p>
+
+   <pre><form method="get" action="/search.cgi">
+ <p><label>Search terms: <input type=search name=q></label></p>
+ <p><input type=submit></p>
+</form></pre>
+
+  </div>
+
+  <div class=example>
+
+   <p>On the other hand, here the <code title=attr-fs-method><a href=#attr-fs-method>method</a></code> attribute is used to
+   specify the value "<code title=attr-fs-method-POST-keyword><a href=#attr-fs-method-post-keyword>post</a></code>", so that the user's
+   message is submitted in the HTTP request's body:</p>
+
+   <pre><form method="post" action="/post-message.cgi">
+ <p><label>Message: <input type=text name=m></label></p>
+ <p><input type=submit value="Submit message"></p>
+</form></pre>
+
+  </div>
+
+  <div class=example>
+
+   <p>In this example, a <code><a href=#the-form-element>form</a></code> is used with a <code><a href=#the-dialog-element>dialog</a></code>. The <code title=attr-fs-method><a href=#attr-fs-method>method</a></code> attribute's "<code title=attr-fs-method-dialog-keyword><a href=#attr-fs-method-dialog-keyword>dialog</a></code>" keyword is used to have the dialog
+   automatically close when the form is submitted.</p>
+
+   <pre lang=en-GB><dialog id="ship">
+ <form method=dialog>
+  <p>A ship has arrived in the harbour.</p>
+  <button type=submit value="board">Board the ship</button>
+  <button type=submit value="call">Call to the captain</button>
+ </form>
+</dialog>
+<script>
+ var ship = document.getElementById('ship');
+ ship.showModal();
+ ship.onclose = function (event) {
+   if (ship.returnValue == 'board') {
+     // ...
+   } else {
+     // ...
+   }
+ };
+</script></pre>
+
+  </div>
+
   <hr><p>The <dfn id=attr-fs-enctype title=attr-fs-enctype><code>enctype</code></dfn> and <dfn id=attr-fs-formenctype title=attr-fs-formenctype><code>formenctype</code></dfn> content attributes are <a href=#enumerated-attribute title="enumerated attribute">enumerated attributes</a> with the following keywords and
   states:</p>
 
@@ -51077,7 +51129,7 @@
    <li><p>Remove <var title="">subject</var>'s <code title=attr-dialog-open><a href=#attr-dialog-open>open</a></code>
    attribute.</li>
 
-   <li><p>If the argument was passed a <var title="">result</var>, then set the <code title=dom-dialog-returnValue><a href=#dom-dialog-returnvalue>returnValue</a></code> attribute to the value of <var title="">result</var>.</li>
+   <li><p>If the argument <var title="">result</var> was provided, then set the <code title=dom-dialog-returnValue><a href=#dom-dialog-returnvalue>returnValue</a></code> attribute to the value of <var title="">result</var>.</li>
 
    <li>
 

Modified: source
===================================================================
--- source	2013-12-10 22:09:38 UTC (rev 8338)
+++ source	2013-12-11 01:14:29 UTC (rev 8339)
@@ -51079,6 +51079,60 @@
   data-x="concept-fs-method">method</span> is that attribute's state; otherwise, it is the <span>form
   owner</span>'s <code data-x="attr-fs-method">method</code> attribute's state.</p>
 
+  <div class="example">
+
+   <p>Here the <code data-x="attr-fs-method">method</code> attribute is used to explicitly specify
+   the default value, "<code data-x="attr-fs-method-GET-keyword">get</code>", so that the search
+   query is submitted in the URL:</p>
+
+   <pre><form method="get" action="/search.cgi">
+ <p><label>Search terms: <input type=search name=q></label></p>
+ <p><input type=submit></p>
+</form></pre>
+
+  </div>
+
+  <div class="example">
+
+   <p>On the other hand, here the <code data-x="attr-fs-method">method</code> attribute is used to
+   specify the value "<code data-x="attr-fs-method-POST-keyword">post</code>", so that the user's
+   message is submitted in the HTTP request's body:</p>
+
+   <pre><form method="post" action="/post-message.cgi">
+ <p><label>Message: <input type=text name=m></label></p>
+ <p><input type=submit value="Submit message"></p>
+</form></pre>
+
+  </div>
+
+  <div class="example">
+
+   <p>In this example, a <code>form</code> is used with a <code>dialog</code>. The <code
+   data-x="attr-fs-method">method</code> attribute's "<code
+   data-x="attr-fs-method-dialog-keyword">dialog</code>" keyword is used to have the dialog
+   automatically close when the form is submitted.</p>
+
+   <pre lang="en-GB"><dialog id="ship">
+ <form method=dialog>
+  <p>A ship has arrived in the harbour.</p>
+  <button type=submit value="board">Board the ship</button>
+  <button type=submit value="call">Call to the captain</button>
+ </form>
+</dialog>
+<script>
+ var ship = document.getElementById('ship');
+ ship.showModal();
+ ship.onclose = function (event) {
+   if (ship.returnValue == 'board') {
+     // ...
+   } else {
+     // ...
+   }
+ };
+</script></pre>
+
+  </div>
+
   <hr>
 
   <p>The <dfn data-x="attr-fs-enctype"><code>enctype</code></dfn> and <dfn
@@ -56371,7 +56425,7 @@
    <li><p>Remove <var data-x="">subject</var>'s <code data-x="attr-dialog-open">open</code>
    attribute.</p></li>
 
-   <li><p>If the argument was passed a <var data-x="">result</var>, then set the <code
+   <li><p>If the argument <var data-x="">result</var> was provided, then set the <code
    data-x="dom-dialog-returnValue">returnValue</code> attribute to the value of <var
    data-x="">result</var>.</p></li>
 




More information about the Commit-Watchers mailing list