Search code examples
c#asp.netpaginationrepeater

Automate pagination with infinite scroll


Currently my program doesn't do any auto scrolling when reaching the end of the page, but it does pagination when an OnClick event happens, I have a couple of nested repeaters in ASP, as for C# this is how I do the pagination with OnClick events through my dataset:

public void relacion_post_comments()
{
    try
    {
        double cuenta;

        SqlConnection cnn = new SqlConnection(ConfigurationManager.ConnectionStrings["ConexionBD"].ConnectionString);

        SqlDataAdapter cmd1 = new SqlDataAdapter("select * from vw_Muro_Posts WHERE POST_ESTATUS != '0' ORDER BY cast([POST_FECHA] as datetime) DESC", cnn);

        DataSet ds = new DataSet();
        cmd1.Fill(ds, "vw_Muro_Posts");

        cuenta = ds.Tables[0].Rows.Count;


        PagedDataSource pagedData = new PagedDataSource();
        pagedData.DataSource = ds.Tables[0].DefaultView;
        pagedData.AllowPaging = true;
        pagedData.PageSize = 10;
        pagedData.CurrentPageIndex = PgNum;

        double nuevacuenta = Math.Round(cuenta / pagedData.PageSize);

        if (PgNum < 1)
            lnkAtras.Visible = false;

        else if (PgNum > 0)
            lnkAtras.Visible = true;

        if (PgNum == nuevacuenta)
            lnkAdelante.Visible = false;

        else if (PgNum < nuevacuenta)
            lnkAdelante.Visible = true;

        SqlDataAdapter cmd2 = new SqlDataAdapter("SELECT * FROM vw_Muro_Comments WHERE COMM_ESTATUS != '0' ORDER BY cast([COMM_FECHA] as datetime) DESC", cnn);

        cmd2.Fill(ds, "vw_Muro_Comments");

        //Aqui se hace el join de los dos repeaters
        ds.Relations.Add("myrelation",
        ds.Tables["vw_Muro_Posts"].Columns["POST_ID"],
        ds.Tables["vw_Muro_Comments"].Columns["POST_ID"]);

        var c = ds.Tables.Count;

        Repeater_UsrPosts.DataSource = pagedData;
        Page.DataBind();
        cnn.Close();
    }


    catch (Exception ex)
    {
        clsLog.ReportarError();
    }
}


public int PgNum
{
    get
    {
        if (ViewState["PgNum"] != null)
            return Convert.ToInt32(ViewState["PgNum"]);
        else
            return 0;
    }
    set
    {
        ViewState["PgNum"] = value;
    }

}

 protected void lnkAdelante_Click(object sender, EventArgs e)
{
    PgNum += 1;
}

    protected void lnkAtras_Click(object sender, EventArgs e)
{
    PgNum -= 1;
}

The question is, how do I replace the OnClick events with something related to the scrolling of the page, or the resolution size, or anything related with the client's view behavior in C#, so that the user doesn't have to make a click, just reach the end of the page to load the next page of the dataset ?

****************************** UPDATE 05/10/17 ********************************

I found a partial solution on this page: https://www.aspsnippets.com/Articles/Implement-Infinite-Scroll-Endless-Scroll-in-ASPNet-using-jQuery-AJAX.aspx

Following through all the steps there I've obtained an infinite scrollable -single- repeater. Although I'm still figuring out how to work with the nested repeater.

So far I've tried the following, without success for displaying the nested repeater's data:

[WebMethod]
public static string GetCustomers(int pageIndex)
{
    return GetCustomersData(pageIndex).GetXml();
}


public static DataSet GetCustomersData(int pageIndex)
{
    string query = "[sp_pro_MuroPosts_PageWise]";
    SqlCommand cmd = new SqlCommand(query);
    cmd.CommandType = CommandType.StoredProcedure;
    cmd.Parameters.AddWithValue("@PageIndex", pageIndex);
    cmd.Parameters.AddWithValue("@PageSize", 10);
    cmd.Parameters.Add("@PageCount", SqlDbType.Int, 4).Direction = ParameterDirection.Output;
    return GetData(cmd);
}

private static DataSet GetData(SqlCommand cmd)
{


    cmd.Connection = clsBaseDatos.sqlConexion;
    using (cmd.Connection)
    {
        using (DataSet ds = new DataSet())
        {
            SqlConnection cnn = new SqlConnection(ConfigurationManager.ConnectionStrings["ConexionBD"].ConnectionString);

            SqlDataAdapter sda = new SqlDataAdapter();
            cmd.Connection = cnn;
            sda.SelectCommand = cmd;
            sda.Fill(ds, "vw_Muro_Posts");

            SqlDataAdapter cmd2 = new SqlDataAdapter("SELECT * FROM vw_Muro_Comments WHERE COMM_ESTATUS != '0' ORDER BY cast([COMM_FECHA] as datetime) DESC", cnn);

            cmd2.Fill(ds, "vw_Muro_Comments");

            //Aqui se hace el join de los dos repeaters
            ds.Relations.Add("myrelation",
            ds.Tables["vw_Muro_Posts"].Columns["POST_ID"],
            ds.Tables["vw_Muro_Comments"].Columns["POST_ID"], false);


            DataTable dt = new DataTable("PageCount");
            dt.Columns.Add("PageCount");
            dt.Rows.Add();
            dt.Rows[0][0] = cmd.Parameters["@PageCount"].Value;
            ds.Tables.Add(dt);

            return ds;
        }
    }
}

Solution

  • User AnandM from aspforums.net had the kindness to resolve this issue (Nested repeaters with infinite scrolling) over the weekend, the original -full- answer is posted on the following post:

    http://www.aspforums.net/Threads/105785/Infinite-Scroll-Applied-to-Parent-Repeater-bringing-nested-data/Replies/2#Replies