添加额外数值以形成单选按钮。

huangapple
go评论142阅读模式
英文:

Including additonal values to form radio buttons

问题

我有一个表单，里面有3个单选按钮。第一个按钮按预期工作，但接下来的两个按钮有额外的值。如果可能的话，当选择单选按钮Choice2或Choice3时，如何包含额外的值？

  1. <form>
  2.   <fieldset>
  3.     <legend>选择报告范围：</legend>
  4.     <div>
  5.       <input type="radio" id="Choice1" name="contactRange" value="lastReport"/>
  6.       <label for="Choice1">上次报告</label><br>
  8.       <input type="radio" id="Choice2" name="contactRange" value="numOfDays"/>
  9.       <label>过去的报告 </label>
  10.         <select>
  11.           <option value="1"> 1 天</option>
  12.           <option value="2"> 2 天</option>
  13.           <option value="3"> 3 天</option>
  14.           <option value="4"> 4 天</option>
  15.           <option value="5"> 5 天</option>
  16.         </select>
  17.       <br>
  19.       <input type="radio" id="Choice3" name="contactRange" value="dateRange">
  20.       <label for="Choice3">日期范围</label>
  21.         <input type="text1" name="startDate" placeholder="开始日期（最旧）">
  22.         <input type="text2" name="endDate"   placeholder="结束日期（最近）">
  23.     </div>
  25.     <div>
  26.       <br><button type="submit">提交</button><br>
  27.     </div>
  28.   </fieldset>
  29. </form>
英文:

I have a form with 3 radio buttons. The first button works as expected, but the next two have additional values. If it is possible, how can I include the additional values when radio buttons Choice2 or Choice3 are selected?

  1. &lt;form&gt;
  2.   &lt;fieldset&gt;
  3.     &lt;legend&gt;Select Report Range:&lt;/legend&gt;
  4.     &lt;div&gt;
  5.       &lt;input type=&quot;radio&quot; id =&quot;Choice1&quot; name=&quot;contactRange&quot; value=&quot;lastReport&quot;/&gt;
  6.       &lt;label for=&quot;Choice1&quot;&gt;Last report&lt;/label&gt;&lt;br&gt;
  8.       &lt;input type=&quot;radio&quot; id=&quot;Choice2&quot; name=&quot;contactRange&quot; value=&quot;numOfDays&quot;/&gt;
  9.       &lt;label&gt;Reports for the last &lt;/label&gt;
  10.         &lt;select&gt;
  11.           &lt;option value=&quot;1&quot;&gt; 1 day&lt;/option&gt;
  12.           &lt;option value=&quot;2&quot;&gt; 2 days&lt;/option&gt;
  13.           &lt;option value=&quot;3&quot;&gt; 3 days&lt;/option&gt;
  14.           &lt;option value=&quot;4&quot;&gt; 4 days&lt;/option&gt;
  15.           &lt;option value=&quot;5&quot;&gt; 5 days&lt;/option&gt;
  16.         &lt;/select&gt;
  17.       &lt;br&gt;
  19.       &lt;input type=&quot;radio&quot; id=&quot;Choice3&quot; name=&quot;contactRange&quot; value=&quot;dateRange&quot;&gt;
  20.       &lt;label for=&quot;Choice3&quot;&gt;Date Range&lt;/label&gt;
  21.         &lt;input type=&quot;text1&quot; name=&quot;startDate&quot; placeholder=&quot;Start Date (oldest)&quot;&gt;
  22.         &lt;input type=&quot;text2&quot; name=&quot;endDate&quot;   placeholder=&quot;End Date (most recent)&quot;&gt;
  23.     &lt;/div&gt;
  25.     &lt;div&gt;
  26.       &lt;br&gt;&lt;button type=&quot;submit&quot;&gt;Submit&lt;/button&gt;&lt;br&gt;
  27.     &lt;/div&gt;
  28.   &lt;/fieldset&gt;
  29. &lt;/form&gt;

I tried adding value= to each of the option and text selections without success. I also tried adding a form within a form but that got pretty ugly and also did not work.

答案1

得分: 0

成功!!!（有点丑，但它有效。）

  1. <form>
  2.   <fieldset>
  3.     <legend>选择报告范围:</legend>
  5.       <input type="radio" id="Choice1" name="contactRange" value="lastReport">
  6.       <label for="Choice1">上次报告</label><br>
  8.       <input type="radio" id="Choice2" name="contactRange" value="numOfDays">
  9.       <label>最近报告</label>
  10.         <select name="days" id="number">
  11.           <option value="1">1 天</option>
  12.           <option value="2">2 天</option>
  13.           <option value="3">3 天</option>
  14.           <option value="4">4 天</option>
  15.           <option value="5">5 天</option>
  16.         </select>
  17.       <br>
  19.       <input type="radio" id="Choice3" name="contactRange" value="dateRange">
  20.       <label for="Choice3">日期范围</label>
  21.         <input type="text1" name="startDate" placeholder="开始日期（最旧）">
  22.         <input type="text2" name="endDate" placeholder="结束日期（最新）">
  24.     <div>
  25.       <br><button type="submit">提交</button><br>
  26.     </div>
  27.   </fieldset>
  28. </form>

第一种情况 "上次报告":
contactRange=lastReport&days=1&startDate=&endDate=

第二种情况 "最近" 2 天的报告:
contactRange=numOfDays&days=2&startDate=&endDate=

第三种情况 "日期范围" 10/3/2023 4:30 AM 到 11/2/2023 6:30 PM:
days=1&contactRange=dateRange&startDate=10%2F3%2F2023+4%3A30+AM&endDate=11%2F2%2F2023+6%3A30+PM

服务器将接受表单输出并解析正确的 "contactRange=" 数据。其余数据只是噪音。

英文:

Sucess!!! (Kind of... the output is ugly but it works.)

  1. &lt;form&gt;
  2.   &lt;fieldset&gt;
  3.     &lt;legend&gt;Select Report Range:&lt;/legend&gt;
  5.       &lt;input type=&quot;radio&quot; id =&quot;Choice1&quot; name=&quot;contactRange&quot; value=&quot;lastReport&quot;&gt;
  6.       &lt;label for=&quot;Choice1&quot;&gt;Last report&lt;/label&gt;&lt;br&gt;
  8.       &lt;input type=&quot;radio&quot; id=&quot;Choice2&quot; name=&quot;contactRange&quot; value=&quot;numOfDays&quot;&gt;
  9.       &lt;label&gt;Reports for the last &lt;/label&gt;
  10.         &lt;select name=&quot;days&quot; id=&quot;number&quot;&gt;
  11.           &lt;option value=&quot;1&quot;&gt; 1 day&lt;/option&gt;
  12.           &lt;option value=&quot;2&quot;&gt; 2 days&lt;/option&gt;
  13.           &lt;option value=&quot;3&quot;&gt; 3 days&lt;/option&gt;
  14.           &lt;option value=&quot;4&quot;&gt; 4 days&lt;/option&gt;
  15.           &lt;option value=&quot;5&quot;&gt; 5 days&lt;/option&gt;
  16.         &lt;/select&gt;
  17.       &lt;br&gt;
  19.       &lt;input type=&quot;radio&quot; id=&quot;Choice3&quot; name=&quot;contactRange&quot; value=&quot;dateRange&quot;&gt;
  20.       &lt;label for=&quot;Choice3&quot;&gt;Date Range&lt;/label&gt;
  21.         &lt;input type=&quot;text1&quot; name=&quot;startDate&quot; placeholder=&quot;Start Date (oldest)&quot;&gt;
  22.         &lt;input type=&quot;text2&quot; name=&quot;endDate&quot;   placeholder=&quot;End Date (most recent)&quot; &gt;
  24.     &lt;div&gt;
  25.       &lt;br&gt;&lt;button type=&quot;submit&quot;&gt;Submit&lt;/button&gt;&lt;br&gt;
  26.     &lt;/div&gt;
  27.   &lt;/fieldset&gt;
  28. &lt;/form&gt;

First case "Last report":
contactRange=lastReport&days=1&startDate=&endDate=

Second case "Reports for the last" 2 days:
contactRange=numOfDays&days=2&startDate=&endDate=

Third case "Date Range" 10/3/2023 4:30 AM 11/2/2023 6:30 PM:
days=1&contactRange=dateRange&startDate=10%2F3%2F2023+4%3A30+AM&endDate=11%2F2%2F2023+6%3A30+PM

The server will take the form output and parse the data for the correct "contactRange=". The rest of the data is just noise.

huangapple
  • 本文由 发表于 2023年3月10日 01:00:04
  • 转载请务必保留本文链接：https://go.coder-hub.com/75687759.html
  • html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定