THIS IS MY .CS CODE
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Services;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
namespace method
{
public partial class method : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
[System.Web.Services.WebMethod]
[System.Web.Script.Services.ScriptMethod(UseHttpGet = true, ResponseFormat = System.Web.Script.Services.ResponseFormat.Json)]
public static string GetData()
{
DataTable dt = new DataTable();
using (SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ToString()))
{
using (SqlCommand cmd = new SqlCommand("select * from data1", con))
{
con.Open();
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(dt);
System.Web.Script.Serialization.JavaScriptSerializer serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
List<dictionary><string,>> rows = new List<dictionary><string,>>();
Dictionary<string,> row;
foreach (DataRow dr in dt.Rows)
{
row = new Dictionary<string,>();
foreach (DataColumn col in dt.Columns)
{
row.Add(col.ColumnName, dr[col]);
}
rows.Add(row);
}
return serializer.Serialize(rows);
}
}
}
[WebMethod]
public static string UpdateStudents(string id, string fname, string lname, string mobileno)
{
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ToString());
con.Open();
SqlCommand cmd = new SqlCommand("UpdateS", con);
cmd.Parameters.Add("@id",SqlDbType.Int).Value=Convert.ToInt32(id);
cmd.Parameters.Add("@fname",SqlDbType.VarChar).Value=fname;
cmd.Parameters.Add("@lname", SqlDbType.VarChar).Value = lname;
cmd.Parameters.Add("@mobileno", SqlDbType.NVarChar).Value = mobileno;
cmd.CommandType = CommandType.StoredProcedure;
SqlDataAdapter da = new SqlDataAdapter();
DataSet ds = new DataSet();
da.SelectCommand = cmd;
da.Fill(ds);
return "record updated successfully";
}
[WebMethod]
public static string DeleteStudents(string id)
{
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ToString());
SqlCommand cmd1 = new SqlCommand("delete from data1 where id=@id ", con);
cmd1.Parameters.Add("@id",SqlDbType.Int).Value=Convert.ToInt32(id);
cmd1.CommandType = CommandType.StoredProcedure;
con.Open();
cmd1.ExecuteNonQuery();
con.Close();
return "record delete successfully";
}
}
}
THIS IS MY ASPX CODE
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="method.aspx.cs" Inherits="method.method" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="Styles/kendo/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="Styles/kendo/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
<link href="Styles/kendo/kendo.default.min.css" rel="stylesheet" type="text/css" />
<script src="Scripts/kendo/jquery.min.js" type="text/javascript"></script>
<script src="Scripts/kendo/kendo.all.min.js" type="text/javascript"></script>
</head>
<body>
<div id="example" class="k-content">
<div id="grid">
</div>
<%----%>
<script>
$(document).ready(function () {
var url = "method.aspx/GetData";
var url1 = 'method.aspx/UpdateStudents';
var url2 = 'method.aspx/DeleteStudents';
var url3="method.aspx/InsertStudents";
dataSource = new kendo.data.DataSource({
transport: {
read: function (options) {
$.ajax({
type: "GET",
url: url,
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (result) {
if (result.d === "error") {
alert('Error occured. Please try again');
}
options.success(JSON.parse(result.d));
},
error: function (result) {
alert(result.Id);
}
});
},
update: function (options) {
var gview = $("#grid").data("kendoGrid");
var selectedItem = gview.dataItem(gview.select());
$.ajax({
type: "POST",
url: url1,
contentType: "application/json; charset=utf-8",
data: JSON.stringify({ 'id': selectedItem.id, 'fname': selectedItem.fname, 'lname': selectedItem.lname, 'mobileno': selectedItem.mobileno }),
dataType: "json",
success: function (result) {
if (result.d !== "success") {
}
dataSource.read();
},
error: function (result) {
alert(result.Id);
}
});
},
destroy: function (options) {
var gview = $("#grid").data("kendoGrid");
var selectedItem = gview.selectedItem(gview.select());
gview.dataSource.remove(selectedItem);
gview.dataSource.remove(0);
$.ajax({
type: "POST",
url: url2,
contentType: "application/json; charset=utf-8",
data: JSON.stringify({ 'id': selectedItem.id }),
dataType: "json",
success: function (result) {
if (result.d !== "success") {
alert(result.d);
}
dataSource.read();
},
error: function (result) {
alert(result.Id);
}
});
},
parameterMap: function (options, operation) {
if (operation !== "read" && options.models) {
return { models: kendo.stringify(options.models) };
}
}
},
batch: true,
pageSize: 20,
schema: {
model: {
id: "id",
fields: {
id: { from: "id", type: "number" },
fname: { from: "fname", type: "string" },
lname: { from: "lname", type: "string" },
mobileno: { from: "mobileno", type: "string" }
}
}
}
});
$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
selectable: "row",
mobile: "phone",
scrollable: true,
height: 430,
{mode:'inline',template:serviceEditTemplate}"
toolbar: ["create", "save", "cancel"],
columns: [
"id",
{ field: "fname", title: "First Name", width: "100px" },
{ field: "lname", title: "Last Name", width: "100px" },
{ field: "mobileno", title: "MobileNO", width: "100px" },
{ command: ["edit", "destroy"], title: " ", width: "172px"}],
editable: {
mode: "inline"
},
});
});
</script>
</div>
</body>
</html>