jqGrid with Web Method/service

Question

hi,

here is my code for jqgrid:

 /// <reference path="jquery-1.3.2.js" />  
/// <reference path="json2.js" />  
/// <reference path="jquery.simplemodal.js" />  


$(document).ready(function() {  
loaddata();  

$("#list").jqGrid({  

    datatype: "local",  
    colNames: ['Date', 'Product', 'Code', 'Title', 'Additional Information'],  
    colModel: [  
    { name: 'date1', index: 'date1', width: 30, align: "center", searchable: true, sortable: true,  
        formatoptions: { srcformat: 'm-d-Y', newformat: 'd.m.Y' },  
        sorttype: 'date', datefmt: 'm.d.Y'  
    },  
    { name: 'pname', index: 'pname', width: 20, align: "center", sortable: true },  
    { name: 'code', index: 'code', width: 15, align: "center", sortable: true, editable: true },  
    { name: '_title', index: '_title', width: 70, align: "center", sortable: true },  
    { name: 'info', index: 'info', width: 50, align: "center", sortable: true },  
],  

    pager: "#pager",  
    viewrecords: false,  
    sortname: 'date1',  
    sortorder: 'desc',  
    caption: "Dolphin News",  
    imgpath: 'themes/steel/images',  
    showpage: true  
});  
jQuery("#grid_id").delGridRow("rowid", { delData: { date: "date1"} });  
jQuery("#list").navGrid("#pager", { refresh: false, edit: false, add: false, del: true, search: true }, {},{},{}, {url:"DelNews"});  
$("#list").setGridWidth(1300, true);  
$("#list").setGridHeight(500, true);  

$("#btnAdd").click(function() {  

    var param = new Object();  
    param.pid = $("select#ctl00_ContentPlaceHolder3_drpProd").val();  
    param.auth = $("#ctl00_hdnLogin").val();  
    param.title = $("#ctl00_ContentPlaceHolder3_txtTitle").val();  
    param.content = $("#ctl00_ContentPlaceHolder3_txtInfo").val();  

    $.ajax({  
        type: "POST",  
        url: "Default.aspx/AddNews",  
        data: JSON.stringify(param),  
        contentType: "application/json; charset=utf-8",  
        cache: false,  
        success: function(response) {  
            alert('News Item Inserted');  
            $.modal.close();  
        }  
    });  
    $("#list").clearGridData();  
    loaddata();  
});  
$("#ctl00_ContentPlaceHolder2_addnews").click(function() {  
    $("#insnews").modal({ opacity: 30, overlayCss: { backgroundColor: "#000" }, containerCss: { width: 610} });  
});  
 });  

 function loaddata() {  
  $.ajax({  
    type: "POST",  
    url: "Default.aspx/GetNews",  
    data: "{}",  
    contentType: "application/json; charset=utf-8",  
    cache: false,  
    success: function(jsondata) {  

        if (jsondata == undefined)  
        { return; }  
        var data = JSON.parse(jsondata)  
        var m = data.d.length;  
        for (var i = 0; i < m; i++) {  

            jQuery("#list").addRowData( i + 1, data.d[i]);  
        }  


    }  
});     
  }  

now the codebehind.. i'm not using MVC and have to learn alot so i'm avoiding it..

  using System;
 using System.Collections.Generic;
  using System.Web;
 using System.Web.UI;
 using System.Web.UI.WebControls;
 using System.Data.SqlClient;
 using System.Configuration;
 using System.Collections;
 using System.Linq;

  public partial class _Default : System.Web.UI.Page
 {
protected void Page_Load(object sender, EventArgs e)
{

}
[System.Web.Services.WebMethod]
public static List<news> GetNews()
{

    IList<news> n1 = new List<news>();
    SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["ProtoTool2ConnectionString"].ConnectionString);
    SqlCommand cmd = new SqlCommand("SELECT News.NewsItemID, News.EnterDate, News.ProductID, News.Author, News.Title, News.Contents, Product.Name,"+ 
                  "Customer.LastName,Customer.FirstName,Product.Code FROM Customer INNER JOIN News ON Customer.LoginName = News.Author INNER JOIN"+
                 " Product ON News.ProductID = Product.ProductID ORDER BY News.EnterDate DESC", con);
    con.Open();
    SqlDataReader rd = cmd.ExecuteReader();
    string a = string.Empty;
    while (rd.Read())
    {
        if (rd.GetSqlString(5).ToString() == "Null" || rd.GetSqlString(5).ToString() == "")
        {
            a = "No Additional Info";
        }
        else a= rd.GetSqlString(5).ToString();

        news info = new news(rd.GetSqlString(6).ToString(), rd.GetSqlDateTime(1).ToString(), rd.GetSqlString(9).ToString(),rd.GetSqlString(4).ToString(),a);
        n1.Add(info);
    }

    return n1.ToList() ;
}
public class news
{
    private int id { get; set; }
    private string content { get; set; }
    private string date { get; set; }
    private string _code { get; set; }
    private string product { get; set; }
    private  string title { get; set; }

    public news()
    {
    }

    public news(string pname, string date1, string code,string _title, string info)
    {
        this.product = pname;
        this.date = date1;
        this._code = code;
        this.content = info;
        this.title = _title;
    }
    public string pname {get { return product; }}
    public string date1 { get { return date; } }
    public string code { get { return _code; } }
    public string _title { get { return title; } }
    public string info { get { return content; } }
}
}

now i want to have editing,deleting and all other features of the jqGrid implemented. with my way i do not think i can achieve it. the docs are not there for such implementation. they are all for MVC