如何使用Bootstrap从数据库中显示10条最新消息?

时间:2018-06-18 05:56:00

标签: c# asp.net twitter-bootstrap

我想从数据库中显示10条近期新闻。我在sql查询中使用了LIMIT 10来显示10个最近的新闻。我正在使用bootstrap。

我从数据库中只收到1条新闻。我知道在这里我必须在设计中使用datalist或listview。但我不知道如何使用Bootstrap实现它。

Default.aspx的:

 <div class="container">
    <h1 class="main-module-title">Recent <span>News</span></h1>

       <%-- <asp:datalist runat="server">
            <ItemTemplate>--%>


              <div class="row-fluid">
        <div class="row"> 
                    <div class="col-xs-12 col-sm-3 col-md-3">
                        <a href="#">                        
                            <asp:Image runat="server" ID="ImgNews" class="img-responsive img-box img-thumbnail"/> 
                        </a>
                    </div> 
                    <div class="col-xs-12 col-sm-9 col-md-9">

                        <h4><a href="#"><asp:Label ID="newsheader" runat="server" Text=""></asp:Label></a></h4>


                        <p runat="server" style="text-align:justify" id="newscontent"> </p>
                    </div> 
                </div>
                <hr/>


                  </div>

<%--                </ItemTemplate>
            </asp:datalist>--%>
    </div>

Default.aspx.cs:

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
       MySqlConnection conn = null;
        string newsitem = null;
        if (!(Request.QueryString["newstitle"] == null))
        {
            Page.Header.Title = Request.QueryString["newstitle"] + " - DubaiExporters ";
        }
        else
        {
            Page.Header.Title = "DubaiExporters - Dubai Business News - UAE Exports";

        }


            try
            {

                string connStr = ConfigurationManager.ConnectionStrings["mysqldbeConnectionString"].ToString();

                string newssql = null;



                newssql = "SELECT * FROM news WHERE status = b'1' AND linkstatus = b'1' ORDER BY datepublished DESC LIMIT 10";
                conn = new MySqlConnection(connStr);
                MySqlCommand cmd = new MySqlCommand(newssql, conn);
               conn.Open();

                MySqlDataReader r = cmd.ExecuteReader(CommandBehavior.CloseConnection);
                if(r.Read())//while(r.Read())
                {
                    newsheader.Text = HttpUtility.HtmlDecode(r["newstitle"].ToString().Trim()).ToString();
                    newscontent.InnerHtml = HttpUtility.HtmlDecode(r["newsbrief"].ToString().Trim()).ToString();
                    ImgNews.ImageUrl = "~/images/newspictures/" + r["image"].ToString();
                }

            }
           catch (MySqlException ex)
           {


           }
            catch (Exception ex)
            {

            }
            finally
            {
                if (conn != null)
                {
                   conn.Close();
                }
            }






    }
}

1 个答案:

答案 0 :(得分:1)

尝试下面的模板并将DataList绑定到Page Load事件里面的DataSource!Page.IsPOstBack条件

<asp:DataList ID="DataList1" runat="server">
        <ItemTemplate>
            <div class="row-fluid">
                <div class="row">
                    <div class="col-xs-12 col-sm-3 col-md-3">
                        <a href="#">
                            <asp:Image runat="server" ID="ImgNews" class="img-responsive img-box img-thumbnail" ImageUrl='<%# "~/images/newspictures/" + Eval("image")%>' />
                        </a>
                    </div>
                    <div class="col-xs-12 col-sm-9 col-md-9">

                        <h4><a href="#">
                            <asp:Label ID="newsheader" runat="server" Text='<%# Eval("newstitle") %>'></asp:Label></a></h4>


                        <p runat="server" style="text-align: justify" id="newscontent"><%# Eval("newsbrief") %></p>
                    </div>
                </div>
                <hr />


            </div>
        </ItemTemplate>
    </asp:DataList>