aspdotnet-suresh offers articles and tutorials,csharp dot net, articles and tutorials,VB.NET Articles,Gridview articles,code examples of 2.0 /3.5,AJAX,SQL Server Articles,examples of .net technologies

jQuery Ajax Submit Form without Page Refresh using JSON in Asp.Net

Nov 27, 2013

Here I will explain how to use jQuery to submit form without page refresh using ajax in or jQuery submit form without page reload using jQuery ajax  in  using c#,

In previous articles I explained
integrate Facebook login authentication, integrate twitter login authentication, jQuery randomly change color of div and many articles relating to jQuery,, c#, Now I will explain how to submit form without refresh or reload page using jQuery in
To implement this first design table in your database like below to save values in database.

Column Name
Data Type
Allow Nulls
Once table creation completed then write code like as shown below in your aspx page

<html xmlns="">
<head id="Head1">
<title>jQuery Submit a form without postback</title>
<script type="text/javascript" src=""></script>
<form id="form1" runat="server">
<td><input type="text" id="txtname" /></td>
<td> <input type="text" id="txtsubject" /></td>
<td> <textarea id="txtbody"></textarea></td>
<input type="button" id="btnSubmit" value="Submit" />
<label id="lblmsg" style="font-weight:bold; color:Red"/>
<script type="text/javascript">
$(function () {
$('#btnSubmit').click(function () {
var name = $('#txtname').val();
var subject = $('#txtsubject').val();
var body = $('#txtbody').val();
if (name != '' && subject != '' && body) {
type: "POST",
contentType: "application/json; charset=utf-8",
url: "Default.aspx/InsertData",
data: "{'username':'" + name + "','subj':'" + subject + "','desc':'" + body + "'}",
dataType: "json",
success: function (data) {
var obj = data.d;
if (obj == 'true') {
$('#lblmsg').html("Details Submitted Successfully");
error: function (result) {
else {
alert('Please enter all the fields')
return false;
After completion of aspx page design add the following namespaces in code behind

C# Code

using System;
using System.Data;
using System.Data.SqlClient;
using System.Web.Services;
After that write the following code in code behind

protected void Page_Load(object sender, EventArgs e)
public static string InsertData(string username, string subj, string desc)
string msg = string.Empty;
using (SqlConnection con = new SqlConnection("Data Source=SureshDasari;Integrated Security=true;Initial Catalog=MySampleDB"))
using (SqlCommand cmd = new SqlCommand("insert into TEMP_User(Name,Subject,Description) VALUES(@name,@subject,@desc)", con))
cmd.Parameters.AddWithValue("@name", username);
cmd.Parameters.AddWithValue("@subject", subj);
cmd.Parameters.AddWithValue("@desc", desc);
int i= cmd.ExecuteNonQuery();
if (i == 1)
msg = "true";
msg = "false";
return msg;

Imports System.Data
Imports System.Data.SqlClient
Imports System.Web.Services

Partial Class VBCode
Inherits System.Web.UI.Page
Protected Sub Page_Load(sender As Object, e As EventArgs)

End Sub
<WebMethod()> _
Public Shared Function InsertData(username As String, subj As String, desc As String) As String
Dim msg As String = String.Empty
Using con As New SqlConnection("Data Source=SureshDasari;Integrated Security=true;Initial Catalog=MySampleDB")
Using cmd As New SqlCommand("insert into TEMP_User(Name,Subject,Description) VALUES(@name,@subject,@desc)", con)
cmd.Parameters.AddWithValue("@name", username)
cmd.Parameters.AddWithValue("@subject", subj)
cmd.Parameters.AddWithValue("@desc", desc)
Dim i As Integer = cmd.ExecuteNonQuery()
If i = 1 Then
msg = "true"
msg = "false"
End If
End Using
End Using
Return msg
End Function
End Class

Download sample code attached 

If you enjoyed this post, please support the blog below. It's FREE!

Get the latest,, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email.

subscribe by rss Subscribe by RSS subscribe by email Subscribe by Email


Software Development and Travel Information said...


Anonymous said...

Good Article. This is the easiest way to imeplement a webservice and use it through ajax. What about security? Can we restrict the usage of webmethod by only my program!?

Keep up the good work!

Anonymous said...

Is this function can work with control? (ex. ASP Button)

Unknown said...

How to create the form filling image that you displayed.(jQuery-Submit-form-without-postback.Gif)


Anonymous said...


Anonymous said...



Unknown said...

how to display the list on text change in text box.. Same like Google search Text Box. as we enter some text it start showing related search..

Amin said...

I know this old method but if you have any other method to do the same then please tell me.

Give your Valuable Comments

Note: Only a member of this blog may post a comment.

© 2015 All Rights Reserved.
The content is copyrighted to Suresh Dasari and may not be reproduced on other websites without permission from the owner.