基於Java中下拉選項選擇的字段添加

Question

我的服務器頁面上有一個dropdown列表字段。 我想根據下拉菜單中選擇的選項向頁面添加文本字段。

呈現字段的Java代碼：

protected void printContent(HttpServletRequest request, HttpServletResponse response) {
        StringBuffer sb = new StringBuffer();
        makeJsScriptsAdvancedRest(request, sb);

        sb.append("<TABLE id='abc' style='width:100%;'> \n");
            makePagingTypeField(sb);
        sb.append("</TABLE>");
        if (option 1 : don't show fields)
        {
            sb.append("<TABLE id='certs1' style='display:none'>");
            makeField1(sb);
            sb.append("</TABLE>");
            sb.append("<TABLE id='certs2' style='display:none'>");
            makeField2(sb);
            makeField3(sb);
            makeField4(sb);
            sb.append("</TABLE>");
        }
        else if (option 2 : show fields in certs1)
        {
            sb.append("<TABLE id='certs1' style='display:block'>");
            makeField1(sb);
            sb.append("</TABLE>");
            sb.append("<TABLE id='certs2' style='display:none'>");
            makeField2(sb);
            makeField3(sb);
            makeField4(sb);
            sb.append("</TABLE>");
        }
        else if (option 3 : show fields in certs2)
        {
            sb.append("<TABLE id='certs1' style='display:none'>");
            makeField1(sb);
            sb.append("</TABLE>");
            sb.append("<TABLE id='certs2' style='display:block'>");
            makeField2(sb);
            makeField3(sb);
            makeField4(sb);
            sb.append("</TABLE>");
        }
        print(sb, true);
    }

編輯：

根據drgPP的回答，我將代碼更改如下。 JavaScript代碼：

FLD_PagingType是PaginField下拉列表的名稱。

protected void makeJsScriptsAdvancedRest(HttpServletRequest request,StringBuffer sb)    {
    sb.append("<script type=\"text/javascript\">\n");
    sb.append("function updateValues() {\n");
    sb.append(" var y = document.getElementById('certs1'); var z = document.getElementById('certs2');"+

            " var x = document.getElementById('" + FLD_PagingType + "'); var w = x.options[x.selectedIndex].text;" +

            "if(w =='" + PAGE_BASED + "') { y.style.display = 'block'; z.style.display = 'none'; }" +

            "else if(w =='" + RECORD_BASED + "') { y.style.display = 'none'; z.style.display = 'block';}  " +

            "else if(w =='" + NO_PAGINATION + "') { y.style.display = 'none'; z.style.display = 'none';} \n");

    sb.append("}\n");
    sb.append("</script>\n");
}

getSelectValue()返回字符串選項值。

我可以正確操作選擇字段，但是當選擇了選項時，UI上的一切都會改變。

任何建議，指針表示贊賞！

Answer 1

首先，在javascript中，要測試相等性，您必須使用== （測試值）或=== （測試值和類型），但不能使用equals()方法（這是一個Java方法）。

您在jQuery標簽中提到過，並且使用過JavaScript 。

示例如何使用jQuery在<select></select>事件上添加偵聽器的示例。

HTML：

<input id="field" name="field" type="text" value="" />
<select id="test" name="test">
 <option value="1">First value</option>
 <option value="2">Second value</option>
</select>

jQuery的：

<script>
$(document).ready(function() {
    $("#test").change(function() {
       var selectedValue = $("#test").val();
       if (selectedValue == "1") {
          $("#field").val("First option selected");
       } else {
          $("#field").val("Second option selected");
       }
    }
    });
});
</script>

PS：不要忘了導入jQuery庫，然后再使用它。