如何发布具有多个选定值的HTML列表框的选择 [英] How to post the selections of an HTML List Box with multiple selected values

查看:87
本文介绍了如何发布具有多个选定值的HTML列表框的选择的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在HTML表单上有一个带有提交"按钮的列表框.列表框启用了多个选择.我可以在列表框中选择多个值,但是我不知道如何确定提交表单时选择了哪些值.另外,我正在使用JavaScript动态将用户生成的值添加到列表框中,并且希望能够在表单提交时告诉两件事:

I have a listbox on an HTML form with a Submit button. The listbox has multiple selection enabled. I am able to select multiple values in the listbox, but I don't know how to figure out what values were selected when the form is submitted. Also, I am adding user generated values to the list box dynamically using JavaScript, and I would like to be able to tell two things when the form submits:

  1. 用户在框中添加了哪些选项?
  2. 用户在框中选择了哪些值?

这可能吗?谢谢.

推荐答案

在下面找到一个页面示例.

Below you find an example of a page.

请注意:

  • select元素(和任何表单元素)需要一个名称才能包含在帖子中.
  • 仅发布select元素中的选定选项.

用户在框中选择了哪些值?

当用户提交表单时,只有选定的值将被发送到服务器.根据您在服务器上使用的语言,有不同的访问方式.

When the user submits the form only the selected values will be sent to the server. Depending on what language you are using at the server there are different ways to access them.

用户在框中添加了哪些选项?

如前所述,您只能看到选择了哪些选项.但是,如何区分选项和用户选项呢?这取决于您要向用户发送什么数据.普遍的答案是,那就是您没有得到的回馈价值.但是,这可以根据您的数据进行简化.由于选项同时具有值​​和文本属性,因此一种将数字值用作预生成值的方法.这样,您的值将在回复中为数字,而用户值将为文本字符串.此方法假定您的用户将不会仅输入数字值.另一种方法是为所有用户生成的值添加前缀(请记住,所有选项都同时具有值​​和文本字段)

As stated before you only see what options that was selected. But how do you distinguish between your options and the users options? That depends on what data you are sending the user. The universal answer is thats the value you get back that you didn't send. However this can be simplified depending on your data. Since the options have both a value and a text property, one way it to use a numeric value for your pregenerated values. That way your values will be numeric in the reply and the users values will be a text string. This approach assumes that your user will not enter just a numeric value. Another approach is to add a prefix to all user generated values (remember you have both a value and a text field for all options)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Test of select box</title>
    <script type="text/javascript">
      function addOpt(e) {
        var o=document.createElement("option");
        //o.value= -e.options.length;
        o.text = "Test " + e.options.length;
        o.selected=true;
        e.add(o,null);
      }
    </script>
  </head>
  <body>
    <form method="post" action="mypage.html">
      <input type="button" onclick="addOpt(this.form.myselect)" value="Add option"/>
      <br/>
      <select id="myselect" name="mydata" multiple="multiple" size="10">
        <option value="0">Test 0</option>
        <option value="1">Test 1</option>
        <option value="2">Test 2</option>
      </select>
      <br/>
      <input type="submit"/>
    </form>
  </body>
</html>

这篇关于如何发布具有多个选定值的HTML列表框的选择的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆