单选按钮而不是下拉列表

时间:2011-05-12 14:59:26

标签: forms

我遇到了问题,我的客户需要我将下拉菜单更改为单选按钮选择,其中1个需要点击无限选项,其他最多可以选择4个。

这就是我的表格:

 <form id="contact-form" name="contact-form" method="post" action="submit.php">
      <table width="100%" border="0" cellspacing="0" cellpadding="5">
        <tr>
          <td width="35%"><label for="name">Name</label></td>
          <td width="52%"><input type="text" class="validate[required,custom[onlyLetter]]" name="name" id="name" value="<?=$_SESSION['post']['name']?>" /></td>
          <td width="13%" id="errOffset">&nbsp;</td>
        </tr>
        <tr>
          <td><label for="email">Email</label></td>
          <td><input type="text" class="validate[required,custom[email]]" name="email" id="email" value="<?=$_SESSION['post']['email']?>" /></td>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td><label for="subject">Area of Interest</label></td>
          <td><select name="subject" id="subject">
            <option value="" selected="selected"> - Choose -</option>
            <option value="interactiveDinner">Interactive Dinner Series</option>
            <option value="winemakerDinner">Winemaker Dinners</option>
            <option value="Culinary Travel">Culinary Travel Adventures</option>
            <option value="education">Food & Beverage Education</option>
            <option value="host a Shikany Event">Host an event at your location</option>
            <option value="partnership">Partner with us</option>
            <option value="Hire Shikany">Hire Chef Michael Shikany for your event</option>
             <option value="Charity Inquiry">Charity / Philanthrophy / Non-profit Inquiry</option>
                     </select>          </td>
          <td>&nbsp;</td>
        </tr>
        <tr>
          <td valign="top"><label for="message">Please provide color to your inquiry</label></td>
          <td><textarea name="message" id="message" class="validate[required]" cols="35" rows="5"><?=$_SESSION['post']['message']?></textarea></td>
          <td valign="top">&nbsp;</td>
        </tr>
        <tr>
          <td><label for="captcha"><?=$_SESSION['n1']?> + <?=$_SESSION['n2']?> =</label></td>
          <td><input type="text" class="validate[required,custom[onlyNumber]]" name="captcha" id="captcha" /></td>
          <td valign="top">&nbsp;</td>
        </tr>
        <tr>
          <td valign="top">&nbsp;</td>
          <td colspan="2"><input type="submit" name="button" id="button" value="Submit" />
          <input type="reset" name="button2" id="button2" value="Reset" />

height="16" alt="loading" /></td>
        </tr>
      </table>
      </form>
      <?=$success?>
    </div>

2 个答案:

答案 0 :(得分:0)

听起来你需要使用复选框而不是单选按钮。这将允许用户根据需要选择尽可能多的选项。要将他们可以选择的数量限制为4,您可以使用http://www.javascriptkit.com/script/script2/checkboxlimit.shtml

中的代码

希望这有帮助。

答案 1 :(得分:0)

您将无法使用单选按钮实现所描述的内容,您需要使用复选框。这只是因此可以选择多个选项。

此外,如果您为每个组中的每个复选框命名相同的名称,例如select1[]select2[]。然后,当您将表单发布回服务器时,所选选项将神奇地存在于数组中。

如果您想限制所选框的数量,那么您必须使用在每个复选框的点击事件中触发的一些javascript来计算所选的数字,并允许或禁止任何进一步的选择。