locked
How to Retrieve Form Element Value and Store it in JSON RRS feed

  • Question

  • User1228272764 posted

    I have this form : 

        <form id="formInputSaudaraKandung1" runat="server" method="post" visible="false">
    <div class="container-fluid">
    <div class="row">
    <div class="col" style="border:dotted">
    <table class="table table-bordered"> <thead> <tr> <th></th> <th>Nama</th> <th>Jenis Kelamin</th> <th>Usia</th> <th>Pendidikan</th> <th>Pekerjaan</th> </tr> </thead> <tbody> <tr> <td>Saudara Kandung Ke-2</td> <td> <asp:TextBox ID="TxtNamaSK2" class="form-control" autocomplete="off" runat="server"></asp:TextBox> <asp:RegularExpressionValidator ID="RegularExpressionValidator5" runat="server" ErrorMessage="Nama Hanya boleh Huruf" ForeColor="Red" ControlToValidate="TxtNamaSK2" ValidationExpression="([A-Za-z])+( [A-Za-z]+)*" ></asp:RegularExpressionValidator> </td> <td> <asp:DropDownList ID="DropDownListJenisKelaminSK2" class="form-control" runat="server"> <asp:ListItem Value="0">Pilih Jenis Kelamin</asp:ListItem> <asp:ListItem Value="1">Pria</asp:ListItem> <asp:ListItem Value="2">Wanita</asp:ListItem> </asp:DropDownList> </td> <td> <asp:TextBox ID="TxtUsiaSK2" onKeypress="return isNumberKey(event)" class="form-control" autocomplete="off" runat="server"></asp:TextBox> <asp:RegularExpressionValidator ID="RegularExpressionValidator6" runat="server" ErrorMessage="Wajib Angka" ControlToValidate="TxtUsiaSK2" ForeColor="Red" ValidationExpression="\d+" ></asp:RegularExpressionValidator> </td> <td> <asp:DropDownList ID="DropDownListPendidikanSK2" class="form-control" runat="server"> <asp:ListItem Value="0">Pilih Jenis Pendidikan</asp:ListItem> <asp:ListItem Value="1">SMA</asp:ListItem> <asp:ListItem Value="2">D1</asp:ListItem> <asp:ListItem Value="3">D2</asp:ListItem> <asp:ListItem Value="4">D3</asp:ListItem> <asp:ListItem Value="5">S1</asp:ListItem> <asp:ListItem Value="6">S2</asp:ListItem> </asp:DropDownList> </td> <td> <asp:DropDownList ID="DropDownListPekerjaanSK2" class="form-control" runat="server"> <asp:ListItem Value="0">Pilih Jenis Pekerjaan</asp:ListItem> <asp:ListItem Value="1">PNS</asp:ListItem> <asp:ListItem Value="2">Peg.Swasta</asp:ListItem> <asp:ListItem Value="3">Wira Usaha</asp:ListItem> <asp:ListItem Value="4">Pensiun</asp:ListItem> <asp:ListItem Value="5">Tidak Bekerja</asp:ListItem> </asp:DropDownList> </td> </tr> </tbody> </table>
    <table class="table table-bordered">
    <thead>
    <tr>
    <th></th>
    <th>Nama</th>
    <th>Jenis Kelamin</th>
    <th>Usia</th>
    <th>Pendidikan</th>
    <th>Pekerjaan</th>
    </tr>
    </thead>
    <tbody>
    <tr>
    <td>Saudara Kandung Ke-3</td>
    <td>
    <asp:TextBox ID="TxtNamaSK3" class="form-control" autocomplete="off" runat="server"></asp:TextBox>
    <asp:RegularExpressionValidator
    ID="RegularExpressionValidator7"
    runat="server"
    ErrorMessage="Nama Hanya boleh Huruf"
    ForeColor="Red"
    ControlToValidate="TxtNamaSK3"
    ValidationExpression="([A-Za-z])+( [A-Za-z]+)*"
    ></asp:RegularExpressionValidator>
    </td>
    <td>
    <asp:DropDownList ID="DropDownListJenisKelaminSK3" class="form-control" runat="server">
    <asp:ListItem Value="0">Pilih Jenis Kelamin</asp:ListItem>
    <asp:ListItem Value="1">Pria</asp:ListItem>
    <asp:ListItem Value="2">Wanita</asp:ListItem>
    </asp:DropDownList>
    </td>
    <td>
    <asp:TextBox ID="TxtUsiaSK3" onKeypress="return isNumberKey(event)" class="form-control" autocomplete="off" runat="server"></asp:TextBox>
    <asp:RegularExpressionValidator ID="RegularExpressionValidator8"
    runat="server"
    ErrorMessage="Wajib Angka"
    ControlToValidate="TxtUsiaSK3"
    ForeColor="Red"
    ValidationExpression="\d+"
    ></asp:RegularExpressionValidator>
    </td>
    <td>
    <asp:DropDownList ID="DropDownListPendidikanSK3" class="form-control" runat="server">
    <asp:ListItem Value="0">Pilih Jenis Pendidikan</asp:ListItem>
    <asp:ListItem Value="1">SMA</asp:ListItem>
    <asp:ListItem Value="2">D1</asp:ListItem>
    <asp:ListItem Value="3">D2</asp:ListItem>
    <asp:ListItem Value="4">D3</asp:ListItem>
    <asp:ListItem Value="5">S1</asp:ListItem>
    <asp:ListItem Value="6">S2</asp:ListItem>
    </asp:DropDownList>
    </td>
    <td>
    <asp:DropDownList ID="DropDownListPekerjaanSK3" class="form-control" runat="server">
    <asp:ListItem Value="0">Pilih Jenis Pekerjaan</asp:ListItem>
    <asp:ListItem Value="1">PNS</asp:ListItem>
    <asp:ListItem Value="2">Peg.Swasta</asp:ListItem>
    <asp:ListItem Value="3">Wira Usaha</asp:ListItem>
    <asp:ListItem Value="4">Pensiun</asp:ListItem>
    <asp:ListItem Value="5">Tidak Bekerja</asp:ListItem>
    </asp:DropDownList>
    </td>
    </tr>
    </tbody>
    </table>
    </div>
    </div>
    <div>

    I want to get all the value by JSON format and consume it in the backend. what do I do?

    Wednesday, October 16, 2019 7:05 AM

All replies

  • User288213138 posted

    Hi tandasanyu,

    I want to get all the value by JSON format and consume it in the backend. what do I do?

    According to your description. I made demo for your.

    I get the data from form by serializeArray() method in jquery. then pass the data to code behind by ajax.

    The code:

    <script>
            $(document).ready(function () {     
                var obj = $('#formInputSaudaraKandung1').serializeArray();
                $.ajax({
                    type: 'POST',
                    url: 'WebForm99.aspx/GetData',
                    data: "{s:" + JSON.stringify(obj) + "}",
                    contentType: 'application/json; charset=utf-8',
                    dataType: 'json',
                    success: function (data) {
                        alert('success');              
                    },             
                });
            });
    
        </script>
    
    
    
            [System.Web.Services.WebMethod]
            public static List<dummy[]> GetData(dummy[] s)
            {
                List<dummy[]> mystring = new List<dummy[]>();
                mystring.Add(s);
                return mystring;
            }
          
    
    
            public class dummy
            {
                public string name { get; set; }
                public string value { get; set; }
            }

    Best regards,

    Sam

    Thursday, October 17, 2019 5:26 AM