简体   繁体   中英

How to pass value of radio button which is clicked to Spring MVC controller?

I am using Spring MVC controller in one of my project.

Below is my JSP code in which it will show three radio button. One is Insert , second radio button is Update and third radio button is Delete .

Once I click Insert radio button, it shows two text box next to Insert radio button, and same thing with other two radio button as well. Here is my jsfiddle

<script type="text/javascript">
    $(document).ready(function(){
        $(".changeAction").on("click", function(){
            $('.changeable').html('')
            var divId = "#" + $(this).attr("div-id");
            var myInput = '<label for="Node"> Node </label> <input type="text" name="node" size="20" /> <label for="Data"> Data </label> <input type="text" name="data" size="100"/>'
            $(divId).html(myInput);
        })
    })      
</script>

<body>
<form method="post" action="testOperation">
    <!-- I used only one hidden box to store value -->
    <input type="hidden" name="name" id="dynamicName">
    <input class="changeAction" type="radio" name="tt" value="Insert" div-id="insert"/> Insert
    <div id="insert" class="changeable"></div>
    <br/> <input class="changeAction" type="radio" name="tt" value="Update" div-id="update"/> Update
    <div id="update" class="changeable"></div>
    <br/> <input class="changeAction" type="radio" name="tt" value="Delete" div-id="delete"/> Delete
    <div id="delete" class="changeable"></div>
    <br/>
    <input type="submit">
</form>
</body>

Below is my method in Controller code -

   @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;
    }

Problem Statement:-

Suppose I click Insert radio button and type Hello in the first text and World in the second text box, then I will hit the submit button, and after that I am seeing Hello value in node variable and World value in data variable which is correct.

But somehow, name variable is coming as empty instead of that it should show insert value as I have clicked insert radio button.

And same thing should happen to update and delete radio button..

Any thoughts what wrong I am doing?

Replace Your Javascript by this. It worked for me.

$(document).ready(function(){
    $(".changeAction").on("click", function(){
        $('.changeable').html('')
        var divId = $(this).attr("div-id");
        $("#dynamicName").val(divId);
        divId = "#"+divId;
        var myInput = '<label for="Node"> Node </label> <input type="text" name="node" size="20" /> <label for="Data"> Data </label> <input type="text" name="data" size="100"/>'
        $(divId).html(myInput);
    })
})

here is jsfiddle http://jsfiddle.net/EGJk8/5/

Change the code as,

From ,

@RequestParam String name

To ,

@RequestParam String tt

Because you have mentioned the name of the radio button as tt . So can't get the value like Insert , Update , Delete .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM