从HTML表单的下拉列表中选择其他选项时不保存文本

I am using the following code to develop a dropdown list in a html form.

我使用以下代码以html格式开发下拉列表。

<html:select property="complaintCategory" onchange="showfield(this.options[this.selectedIndex].value)" >
<html:option value="option1">option1</html:option>
<html:option value="option2">option2</html:option>
<html:option value="option3">option3</html:option>
<html:option value="Other">Other</html:option>
</html:select>
<div id="div1"></div>

I want to create a text box so that user can write something when they select Other option. The function showField(name) is creating the new text box.

我想创建一个文本框,以便用户在选择其他选项时可以编写内容。函数showField(name)正在创建新的文本框。

function showfield(name)
    {
        if(name=='Other')document.getElementById('div1').innerHTML='<input type="text" name="complaintCategory" />';
        else document.getElementById('div1').innerHTML='';
    }

The problem I am facing is that when I select "Other" option from the dropdown list and then write something on it, it is not saving the texts, it is saved as value Other only. I want to pass the texts written in the text box as the complaintCategory. Would really appreciate someone's help on this, i am stuck.

我面临的问题是,当我从下拉列表中选择“其他”选项然后在其上写一些内容时,它不保存文本,它只保存为值Other。我想将文本框中写的文本作为complaintCategory传递。非常感谢别人的帮助,我被困住了。

Thanks in advance...

提前致谢...

1 个解决方案

#1

(I'm working on the assumption that <html:select property="complaintCategory" will output <select name="complaintCategory". It is usually helpful to narrow down the problem to server side code or client side code and provide only one of them.)

(我正在假设

When you submit the form (after selecting other) you will have 2 elements with the same name.

当您提交表单(选择其他表格后)后,您将拥有2个具有相同名称的元素。

Whatever server side code you are using to read the submitted form data, it appears to be taking the first value.

无论您使用什么服务器端代码来读取提交的表单数据,它似乎都是第一个值。

Either:

Modify your server side code to get the second value (I don't know the API you are using to parse the form data so I can't tell you the specifics for that)

修改服务器端代码以获取第二个值(我不知道您用来解析表单数据的API,所以我不能告诉您具体的那些)

Call the generated input by a different name and an if statement.

使用其他名称和if语句调用生成的输入。

e.g.

client side:

if(name=='Other')document.getElementById('div1').innerHTML='<input type="text" name="otherComplaintCategory" />';

server side (psuedo code):

服务器端(伪代码):

IF complaintCategory is "Other":
THEN complaintCategory = otherComplaintCategory

#1