I'm learn for CRUD using Jquery and Ajax in ASP.NET Webform but I'm stuck on delete and update function.
For the insert function working properly, but for delete and update function is not working.
l'll try hard find the error but I cannot find the error and cannot solve it.
This the crud_ajax.aspx
<form id="form1" runat="server">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>ID:
</td>
<td>
<asp:TextBox ID="txtID" runat="server" Text="" />
</td>
</tr>
<tr>
<td>Username:
</td>
<td>
<asp:TextBox ID="txtUsername" runat="server" Text="" />
</td>
</tr>
<tr>
<td>Password:
</td>
<td>
<asp:TextBox ID="txtPassword" runat="server" TextMode="Password" />
</td>
</tr>
<tr>
<td></td>
<td>
<asp:Button ID="btnSave" Text="Save" runat="server" />
<asp:Button ID="btnUpdate" Text="Update" runat="server" />
<asp:Button ID="btnDelete" Text="Delete" runat="server" />
</td>
</tr>
</table>
<hr />
<asp:GridView ID="gvUsers" runat="server" AutoGenerateColumns="false" HeaderStyle-BackColor="#3AC0F2"
HeaderStyle-ForeColor="White" RowStyle-BackColor="#A1DCF2">
<Columns>
<asp:BoundField DataField="Username" HeaderText="Username" />
<asp:BoundField DataField="Password" HeaderText="Password" />
</Columns>
</asp:GridView>
</form>
<script src="jquery.js"></script>
<script src="json2.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(document).on("click", "[id*=btnSave]",function () {
var Username = $("[id*=txtUsername]");
var Password = $("[id*=txtPassword]");
$.ajax({
type: "POST",
url: "crud_ajax.aspx/SaveUser",
data: '{Username:"'+Username.val()+'",Password:"'+Password.val()+'"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert("User has been added successfully.");
window.location.reload();
}
});
return false;
});
})
</script>
<script type="text/javascript">
$(document).ready(function () {
$(document).on("click", "[id*=btnUpdate]",function () {
var ID = $("[id*=txtID]");
var Username = $("[id*=txtUsername]");
var Password = $("[id*=txtPassword]");
$.ajax({
type: "POST",
url: "crud_ajax.aspx/UpdateUser",
data: '{Username:"'+Username.val()+'",Password:"'+Password.val()+'",id:"'+ID.val()+'"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert("User has been Update successfully.");
window.location.reload();
}
});
return false;
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$(document).on("click","[id*=btnDelete]",function () {
var ID = $("[id*=txtID]");
$.ajax({
type: "POST",
url: "crud_ajax.aspx/DeleteUser",
data: '{deleteUserID:"'+ID.val()+'"}',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {
alert("User has been Delete successfully.");
window.location.reload();
}
});
return false;
});
});
</script>
This the code bihind crud_ajax.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
string constr = ConfigurationManager.ConnectionStrings["db_tes"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("SELECT * FROM Users"))
{
using (SqlDataAdapter sda = new SqlDataAdapter())
{
DataTable dt = new DataTable();
cmd.CommandType = CommandType.Text;
cmd.Connection = con;
sda.SelectCommand = cmd;
sda.Fill(dt);
gvUsers.DataSource = dt;
gvUsers.DataBind();
}
}
}
}
}
[WebMethod]
[ScriptMethod]
public static void SaveUser(string Username, string Password)
{
string constr = ConfigurationManager.ConnectionStrings["db_tes"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("INSERT INTO Users(Username,Password) VALUES(@Username, @Password)"))
{
cmd.CommandType = CommandType.Text;
cmd.Parameters.AddWithValue("@Username", Username);
cmd.Parameters.AddWithValue("@Password", Password);
cmd.Connection = con;
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
[WebMethod]
[ScriptMethod]
public static void UpdateUser(string Username, string Password, int ID)
{
string constr = ConfigurationManager.ConnectionStrings["db_tes"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("Update Users SET Username=@Username,Password=@Password Where id=@id)"))
{
cmd.CommandType = CommandType.Text;
cmd.Parameters.AddWithValue("@Username", Username);
cmd.Parameters.AddWithValue("@Password", Password);
cmd.Parameters.AddWithValue("@id", ID);
cmd.Connection = con;
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
[WebMethod]
[ScriptMethod]
public static void DeleteUser(int deleteUserID)
{
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("DELETE FROM Users WHERE id = @id"))
{
cmd.Parameters.AddWithValue("@id", deleteUserID);
cmd.Connection = con;
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
please help, any help I appreciate.