Method for converting form data to JSON

For example, in a form, the input form needs to be JSONized or XMLized after submission, and passed to a third party;
or a JSON or XML returned by a third party is obtained, the data in it is presented, and the form is presented, this It is often used in
data exchange, collect a simple method:

<form method="post" id="formDemo">
        <input name="first" type="text" data-text="text">
        <textarea name="firstArea" cols="20" rows="5" data-text="text"></textarea>
        <input type="checkbox" name="checkboxFirst" value="1" data-text="checkbox">1
        <input type="checkbox" name="checkboxFirst" value="2" data-text="checkbox">2
        <input type="checkbox" name="checkboxSecond" value="3" data-text="checkbox">3
        <input type="checkbox" name="checkboxSecond" value="4" data-text="checkbox">4
        <select name="selectFirst" data-text="select">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
        </select>
        <input type="radio" name="radioFisrt" value="1" data-text="radio">1
        <input type="radio" name="radioFisrt" value="2" data-text="radio">2
        <input type="radio" name="radioSecond" value="3" data-text="radio">3
        <input type="radio" name="radioSecond" value="4" data-text="radio">4
        <button onclick="getValue();">确定</button>
    </form>
</div>
</body>
<script src="jquery-1.11.3.min.js"></script>
<script src="jForm.values.js"></script>
<!--<script src="main.min.js"></script>-->
<script>
 function getValue(){
	 var a=forms.values("formDemo");
        console.log("values is",a);
    }
    $(function () {
       setValue();
//getValue();
        function setValue() {
            var json = {
                first: "11",
                firstArea: "22",
               checkboxFirst: [1],
              checkboxSecond: [4],
              selectFirst: 3,
              radioFisrt: 2,
               radioSecond: 2
          };
           forms.resetValues("formDemo", json);
        }
    });
   


</script>

  In the form, add the corresponding custom attribute to indicate the type of each control;
related JS parsing:

forms = {
    values: function (formName) {
        var value = {};
        // var radioName = '';
        $("#" + formName).find("[data-text='text']").each(function (index, domEle) {
            var name = $(domEle).attr("name");
            value[name] = $(domEle).val();
            //alert(value[name]);
        });
        $("#" + formName).find("[data-text='select']").each(function (index, domEle) {
            var name = $(domEle).attr("name");
            value[name] = $(domEle).find("option:selected").val();
            //alert(value[name]);
        });
        $("#" + formName).find("[data-text='checkbox']").each(function (index, domEle) {
            var checkArr = [];
            var name = $(domEle).attr("name");
            if ($(domEle).filter(":checked").val() != undefined) {
                if (value[name]) {
                    checkArr = value[name];
                    checkArr.push ($ (domEle) .val ());
                    value[name] = checkArr;
                } else {
                    checkArr.push ($ (domEle) .val ());
                    value[name] = checkArr;
                }
            }
            //alert(value[name]);
        });
        $("#" + formName).find("[data-text='radio']").each(function (index, domEle) {
            var name = $(domEle).attr("name");
            if (!value[name] && $(domEle).filter(":checked").val() != undefined) {
                value[name] = $(domEle).filter(":checked").val();
            }
            //alert(value[name]);
        });
       return value;
    },
    resetValues: function (formName, data) {
        $("#" + formName).find("[data-text]").each(function (index, domEle) {
            var name = $(domEle).attr("name");
            if (data[name] != undefined) {
                switch ($(domEle).attr("data-text")) {
                    case "text":
                        $(domEle).val(data[name]);
                        break;
                    case "select":
                        $(domEle).find("option[value='" + data[name] + "']").attr("selected", true);
                        break;
                    case "checkbox":
                        $.each(data[name],function(index,value) {
                            $("#" + formName).find("[name='" + name + "']").filter("[value='" + value + "']").attr("checked", true);
                        });
                        break;
                    case "radio":
                        $("#" + formName).find("[name='" + name + "']").filter("[value='" + data[name] + "']").attr("checked", true);
                        break;
                }
            }
        });
    }
};