Multiple records displayed due to code

Hello Im getting multiple records displayed and they arent descending in order correctly when I insert on button click.

The text is added to the database and it is displayed but I get two sets of records displayed on the page and the text from the insert is pushed down to the bottom of the first multiple record.

How can I correct this so I only get one return on the page and the comment(text from db) is set to desc.

Code:

   protected void Page_Load(object sender, EventArgs e)
    {
        string theUserId = Session["UserID"].ToString();
        PopulateWallPosts(theUserId);
    }
    private void PopulateWallPosts(string userId)
    {

        using (OdbcConnection cn = new OdbcConnection("Driver={MySQL ODBC 3.51 Driver}; Server=localhost; Database=gymwebsite2; User=x; Password=x;"))
        {
            cn.Open();
            using (OdbcCommand cmd = new OdbcCommand("SELECT Wallpostings FROM WallPosting WHERE UserID=" + userId + " ORDER BY idWallPosting DESC", cn))
            {
                using (OdbcDataReader reader = cmd.ExecuteReader())
                {



                    while (reader.Read())
                    {
                        System.Web.UI.HtmlControls.HtmlGenericControl div = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
                        div.Style["float"] = "left";
                        Image img = new Image();
                        img.ImageUrl = "~/userdata/2/uploadedimage/batman-for-facebook.jpg";
                        img.AlternateText = "Test image";
                开发者_开发知识库        div.Controls.Add(img);
                        test1.Controls.Add(div);

                        System.Web.UI.HtmlControls.HtmlGenericControl div1 = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
                        div1.InnerText = String.Format("{0}", reader.GetString(0));

                        div1.Style["float"] = "left";
                        test1.Controls.Add(div1);

                        System.Web.UI.HtmlControls.HtmlGenericControl div2 = new System.Web.UI.HtmlControls.HtmlGenericControl("div");
                        div2.Style["clear"] = "both";
                        test1.Controls.Add(div2);
                    }
                }
            }
        }
    }








    protected void Button1_Click(object sender, EventArgs e)
    {
        string theUserId = Session["UserID"].ToString();
        using (OdbcConnection cn = new OdbcConnection("Driver={MySQL ODBC 3.51 Driver}; Server=localhost; Database=gymwebsite2; User=x; Password=x;"))
        {
            cn.Open();
            using (OdbcCommand cmd = new OdbcCommand("INSERT INTO WallPosting (UserID, Wallpostings) VALUES (" + theUserId + ", '" + TextBox1.Text + "')", cn))
            {
                cmd.ExecuteNonQuery();
            }
        }
        PopulateWallPosts(theUserId);
    }
}

Simply clear the placeholder control before the loop:

test1.Controls.Clear();
while (reader.Read())
{
   ...
}

Call PopulateWallPosts(theUserId); On Page_Prerender rather than twice on Load and on Click.

PS Your code is vulnerable for both SQL injection and XSS. Do not trust to user's input :)