Here I have created sample that will full-fill your requirement.
HTML
<div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jsdelivr.net/json2/0.1/json2.js"></script>
<script type="text/javascript">
$(function () {
$("[id*=btnSave]").bind("click", function () {
debugger;
var user = {};
user.Username = $("[id*=txtUsername]").val();
user.Password = $("[id*=txtPassword]").val();
user.Gender = $("[id*=ddlGender]").val();
user.Member = $("[id*=chkDeclartion]").is(':checked');
user.Declaration = $("[id*=chkDeclartion]").is(':checked');
$.ajax({
type: "POST",
url: "CS.aspx/SaveUser",
data: '{user: ' + JSON.stringify(user) + '}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert("User has been added successfully.");
window.location.reload();
}
});
return false;
});
});
</script>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
Username:
</td>
<td>
<input id="txtUsername" type="text" value=" " />
</td>
</tr>
<tr>
<td>
Password:
</td>
<td>
<input id="txtPassword" type="text" value=" " />
</td>
</tr>
<tr>
<td>
Gender:
</td>
<td>
<select name="ddlGender" id="ddlGender">
<option value="Male">Male</option>
<option value="Female">Female</option>
</select>
</td>
</tr>
<tr>
<td>
Member:
</td>
<td>
<input id="rbMember" type="radio" name="rbMember" value="rbMember" /><label for="rbMember">Member</label>
</td>
</tr>
<tr>
<td>
Declaration :
</td>
<td>
<input id="chkDeclartion" type="checkbox" name="ctl02" /><label for="ctl02">chkTerms</label>
I accecpt terms. I accecpt terms.
</td>
</tr>
<tr>
<td>
</td>
<td>
<asp:Button ID="btnSave" Text="Save" runat="server" />
</td>
</tr>
</table>
</div>
Code
[WebMethod]
[ScriptMethod]
public static void SaveUser(User user)
{
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("INSERT INTO Users VALUES(@Username, @Password,@Gender, @Member,@Declaration)"))
{
cmd.CommandType = CommandType.Text;
cmd.Parameters.AddWithValue("@Username", user.Username);
cmd.Parameters.AddWithValue("@Password", user.Password);
cmd.Parameters.AddWithValue("@Gender", user.Gender);
cmd.Parameters.AddWithValue("@Member", user.Member);
cmd.Parameters.AddWithValue("@Declaration", user.Declaration);
cmd.Connection = con;
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
User Class
public class User
{
public string Username { get; set; }
public string Password { get; set; }
public string Gender { get; set; }
public bool Member { get; set; }
public bool Declaration { get; set; }
}
I hope this will help you out.