JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<form id="edge" class="form-horizontal" method="post" action="javascript:submit();">
    <input type="text" class="input-xlarge" id="latency" name="latency" placeholder="latency">
    <input type="text" class="input-xlarge" id="throughput" name="throughput" placeholder="throughput">
    <input type="text" class="input-xlarge" id="outUID" name="outUID" placeholder="outUID" data-prop="V_ID">
    <input type="text" class="input-xlarge" id="inUID" name="inUID" placeholder="inUID" data-prop="V_ID">
    <button type="submit" class="btn btn-success">Submit Data</button>
</form> <pre></pre>

JavaScript

function submit() {
    var JSONString = "";
    jQuery('#edge input').each(function () {
        var that = jQuery(this);
        var val = that.val();
        var partJSON = "";
        var quote = "\"";
        if (that.data('prop')) {
            partJSON = "{ " + quote +that.data('prop') + quote+ " : " + quote + val + quote + " }";
        } else {
            partJSON = val;
        }
        var comma = that.next('input').length > 0 ? "," : "";

        partJSON = quote + that.prop('id') + quote + ":" + partJSON + comma;
        JSONString += partJSON

    });
    
    JSONString = "{ " + JSONString + " }";

    jQuery('pre').text(JSONString);
}