Unexpected "+" inserted in form field with Twitter bootstrap + Spring

Question

I am using Spring + bootstrap to setup a web application and now I encounter a problem which confuses me. I use modal which contains form to submit content and code as below

<div class="span4">
            <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#addNew" role="button">
                <span class="glyphicon glyphicon-plus">Add</span>
            </button>
            <div class="modal fade" id="addNew" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                            <h4 class="modal-title" id="myModalLabel">Record something useful for you</h4>
                        </div>
                        <div class="modal-body">
                            <form class="form-horizontal" id="newItem" method="POST">
                                <div class="form-group">
                                    <label class="control-label col-md-2">Title</label>
                                    <div class="col-md-8">
                                        <input type="text" class="form-control" id="title"></input>
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="control-label col-md-2">Content</label>
                                    <div class="col-md-8">
                                        <textarea rows="10" class="form-control" id="content"></textarea>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-default" data-dismiss="modal" >Close</button>
                            <button type="button" class="btn btn-primary"  id="NewItemModalSubmit" >Save changes</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

$('#NewItemModalClose').click(function() {
            console.log('NewItemModalClose button clicked.');
            console.log('title field is ', document.getElementById("title").value);
            document.getElementById("title").innerHTML = "";
            console.log('title field is ', document.getElementById("title").value);
            document.getElementById("content").innerHTML = "";
            $("#addNew").modal('toggle');           
        });

The problem is if I input for example "abc def" in any input field, I can see from Spring side "abc+def" received, I print from console it is "abc def" sent to web app. I do not know how this "+" coming from.

I use boostrap's js to implement the modal and I also include the jquery.js since bootstrap need it. — Bing Lan, Jun 12 '14 at 13:12

score 0 · Accepted Answer · edited Oct 07 '21 at 06:16

0

+ is just url encoded space character.

Wikipedia says:

The encoding used by default is based on a very early version of the general URI percent-encoding rules, with a number of modifications such as newline normalization and replacing spaces with "+" instead of "%20".

So according to rfc3986 the space character is %20 but nonetheless it's converted to +

P.S. I'm no familiar with Java but I think this link can help you.

edited Oct 07 '21 at 06:16

Community

1
1

answered Jun 12 '14 at 15:15

Nicolai

1,907
1
23
31

@user3500605, then you can mark my answer as solution ;) – Nicolai Jun 13 '14 at 11:03
I am new user, would like to do that but how? I could not vote since low reputation :) – Bing Lan Jun 13 '14 at 11:10

Unexpected "+" inserted in form field with Twitter bootstrap + Spring

1 Answers1