如何将具有数据的文本框值传递给spring MVC控制器?

时间:2014-03-02 16:49:19

标签: java javascript spring jsp spring-mvc

我在我的一个项目中使用Spring MVC控制器。

下面是我的JSP代码,其中将显示三个单选按钮。一个是Insert,第二个单选按钮是Update,第三个单选按钮是Delete

点击Insert单选按钮后,它会在“插入”单选按钮旁边显示两个文本框,同样会显示其他两个单选按钮 -

<script type="text/javascript">
function doDisplay(radio) {
    switch (radio.value) {
    case "Insert":
        document.getElementById("inserts").style.display = "inline";
        document.getElementById("updates").style.display = "none";
        document.getElementById("delete").style.display = "none";
        document.getElementById("dynamicName").value = "insert";
        break;
    case "Update":
        document.getElementById("inserts").style.display = "none";
        document.getElementById("updates").style.display = "inline";
        document.getElementById("delete").style.display = "none";
        document.getElementById("dynamicName").value = "update";
        break;
    case "Delete":
        document.getElementById("inserts").style.display = "none";
        document.getElementById("updates").style.display = "none";
        document.getElementById("delete").style.display = "inline";
        document.getElementById("dynamicName").value = "delete";
        break;
    }
}
</script>

<body>

  <form method="post" action="testOperation">
  <!-- I used only one hidden box to store value -->
  <input type="hidden" name="name" id="dynamicName">

    <input type="radio" name="tt" value="Insert"
        onclick="doDisplay(this);" /> Insert <span id="inserts"
        style="display: none"> <label for="Node"> Node </label> <input
        type="text" name="node" size="20" /> <label for="Data"> Data </label>
        <input type="text" name="data" size="100" />

    </span> <br /> <input type="radio" name="tt" value="Update"
        onclick="doDisplay(this);" /> Update <span id="updates"
        style="display: none"> <label for="Node"> Node </label> <input
        type="text" name="node" size="20" /> <label for="Data"> Data </label>
        <input type="text" name="data" size="100"/>

    </span> <br /> <input type="radio" name="tt" value="Delete"
        onclick="doDisplay(this);" /> Delete <span id="delete"
        style="display: none"> <label for="Node"> Node </label> <input
        type="text" name="node" size="20" /> <label for="Data"> Data </label>
        <input type="text" name="data" size="100"/>

    </span> <br />
    <input type="submit">
</form>

以下是控制器代码 -

   @RequestMapping(value = "testOperation", method = RequestMethod.GET)
    public Map<String, String> testOperation() {
        final Map<String, String> model = new LinkedHashMap<String, String>();
        return model;
    }

    @RequestMapping(value = "testOperation", method = RequestMethod.POST)
    public Map<String, String> testOperations(@RequestParam String name, 
                                              @RequestParam String node, 
                                              @RequestParam String data) {
        final Map<String, String> model = new LinkedHashMap<String, String>();

        System.out.println(name);
        System.out.println(node);
        System.out.println(data);

        return model;
    }

假设我点击Insert单选按钮并在第一个文本中输入Hello,在第二个文本框中输入World,然后我会点击提交按钮,之后我会看到insert变量中的name值,hello,,变量中的node值和world,,变量中的data值不想要。

与更新和删除相同。

有什么方法可以避免这种情况吗?这意味着我希望节点变量中只有hello值,world变量中只有data值,而不是用逗号分隔。?

任何人都可以帮我吗?

1 个答案:

答案 0 :(得分:2)

单击单选按钮,您只需为用户隐藏字段,但params仍然可见并通过POST请求发送。在春天,具有相同名称的params被视为一个数组。如果您不想发送具有相同名称的乘法参数,则不仅应隐藏输入,还应从jquery中调用以下代码将其删除

$('#input-id').remove();


请记住,您还必须通过单击单选按钮来添加字段。我找到了一个如何实现的例子: http://jsfiddle.net/jaredwilli/tZPg4/4/
您可以在此处找到更多信息Add / remove input field dynamically with jQuery

EDIT
根据您的评论,我建议您使用此代码http://jsfiddle.net/tFLnd/
它要短得多,也许不是最好的,因为我刚刚写了它但是做了工作
当然你必须在页面中添加jQuery才能使用这段代码