Try using encodeURIComponent(str) function.

var test = "Paul John";
var result = encodeURIComponent(test );
//result: "Paul%20John"

To replace the content just before submitting the form use this jquery code:

$(document).ready(function(){
    $('.form-horizontal').submit(function(){
        var encoded = encodeURIComponent($('#nickname').val().trim());
        $('#nickname').val(encoded );
    });
});