.NET UpdatePanel 和 FaceBook / Twitter 按钮答案

【问题标题】：.NET UpdatePanel and FaceBook / Twitter Buttons.NET UpdatePanel 和 FaceBook / Twitter 按钮
【发布时间】：2011-10-25 04:32:23
【问题描述】：

我有一个 UpdatePanel，里面有一个 gridview。在每个 gridviewrows 上，在 gridview 中，我有一个 Twitter 和 FaceBook 按钮。

gridview 在页面加载时可以很好地呈现按钮，但是，一旦在更新面板上完成部分回发，Twitter 和 FaceBook 按钮就不会呈现。

<asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
<!-- search controls.... -->
 <asp:ImageButton ID="btnSearch" ImageUrl="~/img/button-search.gif" runat="server" />

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" EnableModelValidation="True"
                BorderStyle="None" Font-Size="Small" GridLines="None" AllowPaging="True" ShowFooter="True"
                Width="100%" OnPageIndexChanging="GridView1_PageIndexChanging">
                <RowStyle CssClass="row1" />
                <AlternatingRowStyle CssClass="row2" />
                <Columns>
                    <asp:TemplateField>
                        <ItemTemplate>
                            ...
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Literal ID="ltlTwitter" runat="server" Text='<%# GetTwitterURL(Eval("ID"), Eval("SomeText")) %>'></asp:Literal>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Literal ID="ltlFacebook" runat="server" Text='<%# GetFacebookURL(Eval("ID")) %>'></asp:Literal>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:BoundField DataField="ID" HeaderText="ID" SortExpression="ID" Visible="False" />
                </Columns>
                <EmptyDataTemplate>
                    <strong>There are no offers for this search criteria.</strong>
                </EmptyDataTemplate>
            </asp:GridView>
</ContentTemplate>
        <Triggers>
            <asp:PostBackTrigger ControlID="btnSearch" />
        </Triggers>
    </asp:UpdatePanel>

相关C#：

public static string GetTwitterURL(object ID, object text)
{
    ...           
    StringBuilder sb = new StringBuilder();
    sb.Append("<div>");
    sb.Append("<a href=\"http://twitter.com/share\" " +
        "class=\"twitter-share-button\" ");
    sb.AppendFormat("data-url=\"{0}?ID={1}\" ", obj.Property, oID.ToString());
    sb.Append("data-via=\"xxx\" ");
    sb.AppendFormat("data-text=\"{0}\"", xxx);
    sb.Append("data-count=\"none\">Tweet</a>");

    sb.Append("</div>");

    return sb.ToString();

}

public static string GetFacebookURL(object OfferID)
{
    ...

    return string.Format("<fb:like href=\"{0}?ID={1}\" " +
        "send=\"false\" layout=\"button_count\" show_faces=\"false\" " +
        "action=\"like\" font=\"tahoma\"></fb:like>", obj.Property, someInt);
}

此外，相关页面是母版页的子页面。

这是附加的代码隐藏：

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        this.BindOffersGrid(true);
    }
}

public List<Offer> CurrentOffersDataSet
{
    get
    {
        object o = ViewState["CurrentOfferDataSet"];
        return (o == null ? new List<Offer>() : (List<Offer>)o);
    }
    set
    {
        ViewState["CurrentOfferDataSet"] = value;
    }
}

protected void GridView1_PageIndexChanging(object sender, GridViewPageEventArgs e)
{
    GridView1.PageIndex = e.NewPageIndex;
    GridView1.DataSource = this.CurrentOffersDataSet;
    GridView1.DataBind();
}

private void BindOffersGrid(bool ApplyRandomSort)
{
    List<Offer> lstOffers = Offers.GetAllBySearchCriteria(
        Convert.ToInt32(ddlOfferCounty.SelectedValue), 
        Convert.ToInt32(ddlOfferTypes.SelectedValue),
        Convert.ToDateTime(ddlOfferDate.SelectedValue), -1, true);

    ...
    //Some filtering of the dataset with Linq
    ...

    GridView1.DataSourceID = string.Empty;
    this.CurrentOffersDataSet = lstFilteredOffers.
        OrderByDescending(a => a.IsExclusive).
        ThenBy(a => Guid.NewGuid()).
        ToList();
    GridView1.DataSource = this.CurrentOffersDataSet;
    GridView1.DataBind();
}

【问题讨论】：

您是否尝试在项目绑定事件的代码隐藏中设置它们？可能是内联脚本调用不完全兼容，但我不确定，因为我倾向于远离使用这种理所当然的事情。
@Seany84：应该注意的是，在GetTwitterURL 方法中进行的连接并不需要StringBuilder；您可以通过调用string.Format 并将字符串分解为多行上的多个串联来解决问题。编译器将在编译时连接它可以连接的内容，然后连接操作将调用string.Concat，它预先确定返回值的大小，然后将所有项目复制到返回的字符串中。
@casperOne 感谢您的提示。
@Mr.失望你是否建议我在网格的 RowDatabound 事件上调用 GetTwitter() / GetFB()？
@Mr.失望我曾尝试调用 GetFB() 和 GetTwitter() 并在 RowDataBound 事件上设置 Literals 的文本，但这是完全相同的问题。

标签： c# .net facebook twitter updatepanel

【解决方案1】：

好的，我在子页面的最后添加了以下代码，现在 Twitter 和 Facebook 之类的按钮在部分回发后出现。

<script type="text/javascript">

        var prm = Sys.WebForms.PageRequestManager.getInstance();
        prm.add_pageLoaded(pageLoaded);

        var _panels, _count;

        function pageLoaded(sender, args) {
            if (_panels != undefined && _panels.length > 0) {
                for (i = 0; i < _panels.length; i++)
                    _panels[i].dispose();
            }

            var panels = args.get_panelsUpdated();

            if (panels.length > 0) {

                updateFbLike();
            }
        }

        function updateFbLike() {
            $.getScript("http://platform.twitter.com/widgets.js");
            FB.XFBML.parse();
        }


    </script>

【讨论】：