JSFiddle - React, Tailwind, and code Playground

HTML

<form id="student" method="post">
<label>Name: </label><input type="text" name="studentname" /><br />
<label>Age: </label><input type="text" name="age" /><br />
<label>City: </label><input type="text" name="city" />
<input type="submit" value="Submit" id="submitbutton" /><br />
</form>

<pre id="result"></pre>

JavaScript

$.fn.serializeObject = function()
{
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};
$(function() {
    $('form').submit(function() {
        var txt = JSON.stringify($('form').serializeObject());
        $('#result').text(txt, null, 4);
        var recipe =  window.open('','RecipeWindow','width=600,height=600');
        var html = '<html><head><title>Result Window</title></head><body><div>' + txt + '</div></body></html>';
    recipe.document.open();
    recipe.document.write(html);
    recipe.document.close();
        return false;
    });
})