Question

我有一个数据列表，其中huperlinks将填充文章名称列表。点击任何文章链接时，我在

标签内加载内容，ID =“POST”

问题是，当我点击我的datalist中的链接时，页面会刷新以加载内容。我怎么解决这个问题？感谢

<asp:ScriptManager ID="scm" runat="server">
</asp:ScriptManager>
<table>
    <tr>
        <td>
            <asp:Panel ID="Panel1" runat="server" Width="800">
                <div id="divContent" runat="server" class="post">
                    <table id="tblPost" style="float" border="1" style="border-style: outset; border-width: thin"
                        width="250" height="200" align="right">
                        <tr>
                            <td class="style2">
                                <asp:Label ID="Label1" runat="server" Width="200" Font-Bold="True" Text="Article Sections"></asp:Label>
                            </td>
                        </tr>
                        <tr>
                            <td align="left">
                                <asp:DataList ID="DLArticles" runat="server">
                                    <ItemTemplate>
                                        <table id="Table2" visible="true" align="left">
                                            <tr align="left">
                                                <td>
                                                    <asp:HyperLink ID="hypSubSections" runat="server" NavigateUrl='<%# "~/News.aspx?FID=" + DataBinder.Eval(Container.DataItem,"FID") + "&CID=" + DataBinder.Eval(Container.DataItem,"CID") %>'
                                                        Text='<%# DataBinder.Eval(Container.DataItem,"Title") %>'></asp:HyperLink>
                                                </td>
                                                </td>
                                            </tr>
                                        </table>
                                    </ItemTemplate>
                                </asp:DataList>
                            </td>
                        </tr>
                        <tr>
                            <td align="right">
                                <asp:HyperLink ID="HypViewALL" runat="server">View All</asp:HyperLink>
                            </td>
                        </tr>
                    </table>
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                        <ContentTemplate>
                            <p id="POST" runat="server">
                            </p>
                        </ContentTemplate>
                        <Triggers>
                            <asp:AsyncPostBackTrigger ControlID="DLArticles" />
                        </Triggers>
                    </asp:UpdatePanel>
                </div>
            </asp:Panel>
        </td>
    </tr>
</table>

Answer 1

首先，您需要使用允许使用多个关键字段名称的数据驱动控件。 DataList没有此功能，因此您需要使用GridView或ListView控件。由于每个帖子都使用FID和CID值的唯一组合来表示，因此将这些字段设置为DataKeyNames。然后，将HyperLink更改为LinkButton控件并设置相应的CommandName属性值。之后，您需要将每个LinkButton注册为AsyncPostback控件（在页面上，而不是在UpdatePanel1的触发器集合中），或者只需通过UpdatePanel包装整个ListView。然后，您只需处理SelectedIndexChanged事件并更新帖子内容。

<asp:UpdatePanel runat="server" UpdateMode="Conditional" >
     <ContentTemplate>
          <asp:ListView runat="server" ID="ListView1" DataKeyNames="FID,CID">
               <LayoutTemplate>
                    <table>
                         <asp:PlaceHolder runat="server" ID="itemPlaceholder" />
                    </table>
               </LayoutTemplate>
               <ItemTemplate>
                    <tr style="text-align: left;">
                         <td>
                              <asp:LinkButton ID="LinkButton1" runat="server" CommandName="Select" Text='<%# Eval("Title") %>' />
                         </td>
                    </tr>
               </ItemTemplate>
          </asp:ListView>
     </ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel runat="server" UpdateMode="Conditional">
     <ContentTemplate>
          <p runat="server" id="POST">
          </p>
     </ContentTemplate>
     <Triggers>
          <asp:AsyncPostBackTrigger ControlID="ListView1" EventName="SelectedIndexChanged" />
     </Triggers>
</asp:UpdatePanel>

private static readonly List<Post> DataSource = new List<Post>
{
    new Post{FID = 1, CID = "1", Title="First", Content= Guid.NewGuid().ToString()},
    new Post{FID = 2, CID = "1", Title="Second", Content= Guid.NewGuid().ToString()},
    new Post{FID = 1, CID = "2", Title="Third", Content= Guid.NewGuid().ToString()},
    new Post{FID = 2, CID = "2", Title="Fourth", Content= Guid.NewGuid().ToString()},
};

protected void Page_Init(object sender, EventArgs e)
{
    ListView1.SelectedIndexChanging += ListView1_SelectedIndexChanging;
    ListView1.SelectedIndexChanged += ListView1_SelectedIndexChanged;
}

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        ListView1.DataSource = DataSource;
        ListView1.DataBind();
    }
}

void ListView1_SelectedIndexChanging(object sender, ListViewSelectEventArgs e)
{
    ListView1.SelectedIndex = e.NewSelectedIndex;
}

void ListView1_SelectedIndexChanged(object sender, EventArgs e)
{
    var dataKey = ListView1.SelectedDataKey;
    var fid = (int)dataKey["FID"];
    var cid = dataKey["CID"] as string;

    var post = DataSource.FirstOrDefault(p => p.FID == fid && p.CID == cid);
    if (post != null)
    {
        POST.InnerText = Server.HtmlEncode(post.Content);
    }

}

public class Post
{
    public int FID { get; set; }

    public string CID { get; set; }

    public string Title { get; set; }

    public string Content { get; set; }
}

即使在使用Update Panel - AJAX之后，页面也会刷新

1 个答案: