如何将数据添加到Gridview?

时间:2016-04-26 05:13:12

标签: jquery html asp.net gridview

我正在尝试创建一个项目,将网站的源代码作为文本区域的输入,然后搜索以查找该页面中的元素数量。我能够搜索并将输出作为警报弹出窗口。我希望输出在网格视图或数据表而不是警报弹出窗口。 主页代码是:

<body>

  <textarea id="TextArea1"></textarea>
  <br />
  <input id="Submit1" type="submit" value="submit" /></div>

    <script>
                var $textarea = $('#TextArea1'), $submit = $('#Submit1');
            $submit.click(function (e) {
                    e.preventDefault();
                    sourceCode = $textarea.val();
                    var $searchObject = $('<div id="Searching"></div>');
                    $searchObject.append($(sourceCode));

        alert("Number of text boxes = " + $searchObject.find('[type=text]').length);
                    $searchObject.find('[type=text]').each(function () {
                    alert("Name of textbox = " + $(this).attr("name") + " and its ID is " + $(this).attr("id"));
        });

        alert("Number of Submit Buttons = " + $searchObject.find('[type=submit]').length);
                    $searchObject.find('[type=submit]').each(function () {
                    alert("Name of Submit button = " + $(this).attr("name") + " and its ID is =" + $(this).attr("id"));
        });
    </script>

<form runat="server">
  <asp:GridView ID="GridView1" runat="server"  AutoGenerateColumns="False" Height="178px" Width="1191px">
    <Columns>
    <asp:BoundField HeaderText="Element" DataField="Element"/>
    <asp:BoundField HeaderText="Element Name" DataField="Element name"/>
    <asp:BoundField HeaderText="Element ID" DataField="Element ID"/>
    </Columns>
    </asp:GridView>
    <asp:Button ID="Button1" runat="server" Text="WebElements.xlsx" />
</form>

</body>
</html>

后端代码是:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
namespace Generic_GUI
{
    public partial class HomePage : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!this.IsPostBack)
            {
                DataTable dt = new DataTable();
                dt.Columns.AddRange(new DataColumn[4] {
                            new DataColumn("Element",typeof(string)), 
                            new DataColumn("Element Name",typeof(string)), 
                            new DataColumn("Element ID",typeof(string)), 

                dt.Rows.Add("", "", "", "");
                dt.Rows.Add("", "", "", "");
                dt.Rows.Add("", "", "", "");
                GridView1.DataSource = dt;
                GridView1.DataBind();
            }
        }       
    }
}

任何人都可以帮我解决问题,将输出转移到网格视图而不是警告弹出窗口吗?我之前没有使用过GridView,因此不知道如何实现这一目标。

1 个答案:

答案 0 :(得分:0)

创建一个存储结果的类

    public class Element
    {
        public string Type { get; set; }
        public string Name { get; set; }
        public string ID { get; set; }

        public Element( string type = "", string name = "", string id = "")
        {
            this.Type = type;
            this.Name = name;
            this.ID=id;
        }
    }

创建一个IEnumerable容器来保存

    public List<Element> ListOfElements = new List<Element>();

    // Example population of List<>
    Element el;

    el = new Element( "Type1", "Name1", "ID1" );
    ListOfElements.Add( el );

    el = new Element( "Type2", "Name2", "ID2" );
    ListOfElements.Add( el );

填充List后,将其绑定到Gridview

GridView1.DataSource = ListOfElements ;
GridView1.DataBind();

GridView可以在标记中定义为:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
    <Columns>
        <asp:BoundField DataField="Type" HeaderText="Element Type"  SortExpression="Type"/>
        <asp:BoundField DataField="Name" HeaderText="Element Name"   SortExpression="Name"/>
        <asp:BoundField DataField="ID" HeaderText="ID"   SortExpression="ID"/>
    </Columns>
</asp:GridView>