JSFiddle - React, Tailwind, and code Playground

by vijayweb

HTML

<input type="text" class="1011tagid" id="1011" onkeypress="myFunction(this.id)" onchange="myFunction2(this.id)">
    <input type="text" class="1011tagval" id="1011" onkeypress="myFunction(this.id)" onchange="myFunction2(this.id)">
<br>
<input class="vartag"  type="text" id="1011final">
<br><br>
<input type="text" class="1012tagid" id="1012" onkeypress="myFunction(this.id)" onchange="myFunction2(this.id)">
    <input type="text" class="1012tagval" id="1012" onkeypress="myFunction(this.id)" onchange="myFunction2(this.id)">
<br>
 <input class="vartag" type="text" id="1012final">
<br><br>
<input type="text" class="1013tagid" id="1013" onkeypress="myFunction(this.id)" onchange="myFunction2(this.id)">
    <input type="text" class="1013tagval" id="1013" onkeypress="myFunction(this.id)" onchange="myFunction2(this.id)">
<br>
<input class="vartag" type="text" id="1013final">
<br><br>

<button id="submit">Submit
</button>

JavaScript

function myFunction2(val) {
            window.tagid = $("."+val+"tagid").val();
            window.tagval = $("."+val+"tagval").val();
     
            var mySpan = hier2();
            $("#"+val+"final").val(mySpan);
        }

        function emptyCheck2(vals) {
            if (vals === "")
                return true;
            else
                return false;
        }

        function hier2() {
            var data = [];
            var pageName = "";
            if (!emptyCheck2(tagid)) data.push(tagid);
            if (!emptyCheck2(tagval)) data.push(tagval);

            for (i = 0; i < data.length; i++) {
                pageName += data[i] + '="';
            }
            return pageName.substring(0, pageName.length - 2)+'";';
        }
        
        


$( "#submit" ).click(function() {

alert(tagdata);
});