asp.net表格代码背后

时间:2017-03-31 20:39:02

标签: c# asp.net

我开始学习asp.net。我在后面的代码中创建一个表有问题。我从我的数据库加载数据,我想在表格中显示它,并且还有一个指向另一个页面的链接。

这是我的aspx代码:

<div class="container">
        <div class="row">
            <div class="col-lg-12">
                <h3>Search Books</h3>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-4 col-lg-offset-4">
                <input type="search" id="search" value="" class="form-control" />
            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <table class="table" id="table">
                    <thead>
                        <tr>
                            <th>Author</th>
                            <th>Title</th>
                        </tr>
                    </thead>
                    <tbody>
                        <%=getWhileLoopData()%>
                    </tbody>
                </table>
                <hr />
            </div>
        </div>
    </div>

我的cs代码:

public string getWhileLoopData()
{
    string htmlStr = "";
    var query = (from b in db.Books
                 where b.Available == true
                 orderby b.DataInserted descending
                 select b).Take(10);

    foreach (var row in query)
    {
        LinkButton btn = new LinkButton();
        btn.ID = "openBook" + row.Id;
        btn.CommandArgument = row.Id.ToString();
        btn.Command += Load_Book;
        btn.Text = "Open Book";
        htmlStr += "<tr><td>" + row.Author + "</td><td>" + row.Title + "</td><td>" + btn + "</td>";
    }

    return htmlStr;
}

private void Load_Book(object sender, CommandEventArgs e)
{
    Response.Redirect("Book.aspx?Id=" + e.CommandArgument);
}

处理搜索选项的JavaScript:

$(function () {
$('#table').searchable({
    striped: true,
    oddRow: { 'background-color': '#f5f5f5' },
    evenRow: { 'background-color': '#fff' },
    searchType: 'fuzzy'
});

$('#searchable-container').searchable({
    searchField: '#container-search',
    selector: '.row',
    childSelector: '.col-xs-4',
    show: function (elem) {
        elem.slideDown(100);
    },
    hide: function (elem) {
        elem.slideUp(100);
    }
})

});

几乎一切正常。但Linkbutton只显示一个字符串“System.Web.UI.WebControls.LinkBut​​ton”。有谁知道我做错了什么?这是实施的最佳方式吗?

由于

2 个答案:

答案 0 :(得分:3)

我们通常不会从ASP.Net Web Form中的代码创建html标签;它可能非常脆弱,难以维护。相反,我们使用数据控件,如GridView,ListView。

例如,

enter image description here

<asp:GridView runat="server" ID="BookGridView" AutoGenerateColumns="False"
    ItemType="DemoWebForm.Book">
    <Columns>
        <asp:BoundField DataField="Author" HeaderText="Author" />
        <asp:BoundField DataField="Title" HeaderText="Title" />

        <%-- Use HyperLinkField if you do not need to postback to server --%>
        <asp:HyperLinkField DataNavigateUrlFields="Id" 
            DataNavigateUrlFormatString="Book.aspx?Id={0}" 
            Text="Open Book" HeaderText="Redirect to New Page" />

        <asp:TemplateField HeaderText="Post Back and Redirect">
            <ItemTemplate>
                <asp:LinkButton runat="server" ID="OpenBookLinkButton" Text="Open Book" 
                    OnCommand="Load_Book" CommandArgument="<%#: Item.Id %>">
                </asp:LinkButton>
            </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

代码背后

namespace DemoWebForm
{
    public class Book
    {
        public int Id { get; set; }
        public string Author { get; set; }
        public string Title { get; set; }
    }

    public partial class _Default : Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                BookGridView.DataSource = new List<Book>
                {
                    new Book {Id = 1, Author = "One", Title = "One Hundred"},
                    new Book {Id = 2, Author = "Two", Title = "Two Hundreds"},
                    new Book {Id = 3, Author = "Three", Title = "Three Hundreds"},
                };
                BookGridView.DataBind();
            }
        }

        protected void Load_Book(object sender, CommandEventArgs e)
        {
            Response.Redirect("Book.aspx?Id=" + e.CommandArgument);
        }
    }
}

答案 1 :(得分:2)

我建议关注所有注释消息,但是为什么你的链接按钮最终显示:System.Web.UI.WebControls.LinkBut​​ton是因为当用字符串连接它时它就像调用.ToString()一样它返回一个包含对象类型的字符串。如果您想继续关注您的路线,则需要在字符串中加入实际的html标记,以显示您的链接按钮

<button></button> 

<input type="button"></input> 

或事件一个简单的链接:

<a href="#">click me</a>