ASP.NET MySQL Load data on page scroll

[veny]

Hi all,
Im working on a web application in which I need to show data from MySQL on page scroll. Ive found a reference online, below is the code. I want to customize this and show my data in ASP:GridView

ASPX page

<form id="form1" runat="server">
        <div>
            <h1>
                Demo page: Load data while scrolling with ASP.NET and JQuery</h1>


        </div>
        <div id="mainDiv">
            <div id="wrapperDiv">
                <p>
                    <span>1</span> Static data initially rendered.
                </p>
                <p>
                    <span>2</span> Static data initially rendered.
                </p>
                <p>
                    <span>3</span> Static data initially rendered.
                </p>
                <p>
                    <span>4</span> Static data initially rendered.
                </p>
                <p>
                    <span>5</span> Static data initially rendered.
                </p>
            </div>
            <div id="wra" style="height:300px;overflow:auto">
                <asp:GridView ID="GridView1" runat="server" ></asp:GridView>
            </div>
        </div>
    </form>

Code Behind .cs

public partial class LoadOnScroll : System.Web.UI.Page
{
    private static int counter = 6;
    protected void Page_Load(object sender, EventArgs e)
    {
        counter = 6;
    }

    [WebMethod]
    public static string GetDataFromServer()
    {
        DataSet ds = new DataSet();
        string connString = "server=localhost; Integrated Security=SSPI; database=needy; username=root; password=ietmdb;";
        MySqlConnection mycon = new MySqlConnection(connString);
        MySqlCommand cmd = new MySqlCommand("select * from rest", mycon);
        MySqlDataAdapter adp = new MySqlDataAdapter(cmd);

        int retVal = adp.Fill(ds);

        string resp = string.Empty;
        for (int i = 1; i <= ds.Tables[0].Rows.Count; i++)
        {
            string strComment = string.Empty;
            if (ds.Tables != null)
            {
                if (ds.Tables[0] != null)
                {
                    if (ds.Tables[0].Rows.Count > 0)
                    {
                        if (ds.Tables[0].Rows.Count >= i - 1)
                        {
                            if (ds.Tables[0].Rows[i - 1][0] != DBNull.Value)
                            {
                                //GridView1.DataSource();
                                strComment = ds.Tables[0].Rows[i - 1][0].ToString();
                            }
                        }
                    }
                }
            }
            resp += "<p><span>"  + "</span> " + strComment + "</p>";
        }
        return resp;
    }
}

JS File

$(document).ready (function() {
       $contentLoadTriggered = false;
       $("#mainDiv").scroll (function()  {
         if($("#mainDiv").scrollTop() >= ($("#wrapperDiv").height() - $("#mainDiv").height()) && $contentLoadTriggered == false)
             {
               $contentLoadTriggered = true;
               $.ajax  (
               {
                 type: "POST",
                 url: "LoadOnScroll.aspx/GetDataFromServer",
                 data: "{}",
                 contentType: "application/json; charset=utf-8",
                 dataType: "json",
                 async: true,
                 cache: false,
                 success:    function (msg) 
                  {                                       
                     $("#wrapperDiv").append(msg.d);
                     $contentLoadTriggered = false;    },
                     error:  function (x, e)
                       {
                       alert("The call to the server side failed. " + x.responseText);
                       }
                  });
              }
             });
           });