2

フェイスブックのようなボタンとグーグル+ボタンをウェブパーツ内に配置しました。ウェブパーツは更新パネル内にあります。問題は、更新パネルを介して非同期ポストバックが行われると、fbボタンとg+ボタンが消えることです。

以前に同様の問題に直面したTwitterボタンもあります。更新パネルの外にtwitterjavascriptを配置した後、これが機能するようになりました。

<asp:updatepanel ID="UpdatePanel1" runat="server">
     <asp:WebPartManager ID="WebPartManager1" runat="server">
     </asp:WebPartManager>
     <script type="text/javascript">              
            Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequest);                
     </script>
     <asp:webpartzone ID="WebPartZone1" runat="server" PartChromeType="None" >
       <ZoneTemplate>
       .
       .
       .
        <a href="http://twitter.com/share" class="twitter-share-button" data-count="none">Tweet Profile</a><br />
        <div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=181772605219534&amp;xfbml=1"></script><fb:like href="" send="false" layout="button_count" width="50" show_faces="false" font="trebuchet ms"></fb:like>
        <br/>
        <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
        <g:plusone size="medium" count="true"></g:plusone>
         .
         .
         </ZoneTemplate>
     </asp:webpartzone>
     <asp:webpartzone ID="WebPartZone2" runat="server" Width="100%" 
                            PartChromeType="None">
         .
         .
         .
     </asp:webpartzone>
</asp:updatepanel>

<script type="text/javascript">
    function pageLoad() {
        $.getScript("http://platform.twitter.com/widgets.js");
    }
</script>

これにより、Twitterのツイートボタンの部分的なポストバック後に壊れたJavaScriptがリロードされ、正常に機能します。しかし、私がjavascriptsを置き換えるとき、同じことはfacebookとgoogleplusボタンでは起こりません。ASP.NET 4とc＃を使用しています。どうすればこれを修正できますか？

4

3 に答える 3

3

UpdatePanelは、innerHTMLプロパティを設定してコンテンツを更新します。これは、UpdatePanel非同期ポストバック後にUpdatePanel要素内のDOM状態が失われることを意味します。fb、g +、およびtwitterボタンはすべて、UpdatePanelのDOM状態で機能しますdiv。これは、サーバーがinnerHTMLデルタをクライアントに送信するときに消去されます。

ここで私の答えを参照してください：部分的なポストバックの後にRegisterClientScriptCodeが機能しない

Webパーツの非同期ポストバックを無効にするか、スクリプトを別の場所に配置する必要があります。

更新された質問

これを試しましたか？要素を削除し、<script>jqueryを使用して呼び出します。

<asp:updatepanel............>
     <asp:WebPartManager ID="WebPartManager1" runat="server" />
     <asp:webpartzone...........>
       .
       .
       .
        <a href="http://twitter.com/share" class="twitter-share-button" data-count="none">Tweet Profile</a><br />
        <div id="fb-root"></div><fb:like href="" send="false" layout="button_count" width="50" show_faces="false" font="trebuchet ms"></fb:like><br/>
        <g:plusone size="medium" count="true"></g:plusone>
     </asp:webpartzone>
</asp:updatepanel>

<script type="text/javascript">
    function pageLoad() {
        $.getScript("http://platform.twitter.com/widgets.js");
        $.getScript("http://connect.facebook.net/en_US/all.js#appId=181772605219534&amp;xfbml=1");
        $.getScript("https://apis.google.com/js/plusone.js");
    }
</script>

それでもうまくいかない場合は、ボタンを静的パネルに分けてみませんか？ボタンはUpdatePanelには使用できません。このようなもの：

<!-- webpartmanager does NOT need to enclose your webparts. 
     Just declare it. -->
<asp:webpartmanager ... /> 

<!-- asp:updatepanel contains the async webpart. -->
<asp:updatepanel ...> 
    <asp:WebPartZone id="WebPartZone1" runat="server">
      <ZoneTemplate>
        ...
      </ZoneTemplate>
    </asp:WebPartZone>
</asp:updatepanel>

<!-- another webpart holds the buttons, NOT contained by updatepanel. -->
<asp:WebPartZone id="WebPartZone2" runat="server">
  <ZoneTemplate>
    <a href="http://twitter.com/share" class="twitter-share-button" data-count="none">Tweet Profile</a><br />
    <div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=181772605219534&amp;xfbml=1"></script><fb:like href="" send="false" layout="button_count" width="50" show_faces="false" font="trebuchet ms"></fb:like><br/>
    <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
    <g:plusone size="medium" count="true"></g:plusone>
  </ZoneTemplate>
</asp:WebPartZone>
于 2011-07-20T15:18:02.770 に答える
0

これは非常に珍しい解決策のように見えるかもしれませんが、これはchromeとfirefoxで機能しました。

更新パネル内と更新パネル（jquery呼び出し）の両方でFacebookのjavascriptsrcリンクを保持したときに機能しました。TwitterおよびGoogle+ボタンの場合、更新パネルの外部でjqueryからのみ呼び出す必要があります。次の組み合わせを使用すると機能しました。

<asp:updatepanel............>
 <asp:WebPartManager ID="WebPartManager1" runat="server">
 </asp:WebPartManager>
 <asp:webpartzone...........>
   .
   .
   .
    <a href="http://twitter.com/share" class="twitter-share-button" data-count="none">Tweet Profile</a><br />
    <div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=181772605219534&amp;xfbml=1"></script><fb:like href="" send="false" layout="button_count" width="50" show_faces="false" font="trebuchet ms"></fb:like>
    <br/>
    <g:plusone size="medium" count="true"></g:plusone>
     .
     .
 </asp:webpartzone>
 <asp:webpartzone ..........>
     .
     .
     .
 </asp:webpartzone>
</asp:updatepanel>
<script type="text/javascript">
  function pageLoad() {
    $.getScript("http://platform.twitter.com/widgets.js");          
    $.getScript("http://connect.facebook.net/en_US/all.js#appId=181772605219534&amp;xfbml=1");
    $.getScript("https://apis.google.com/js/plusone.js");
            }
</script>

注： Google +1ボタンはInternetExplorerでは引き続き機能しませんが、ChromeとFirefoxでは3つのボタンすべてが正常に機能します。

于 2011-07-20T16:49:00.293 に答える
0

私は常にそれらを部分的なポストバックから除外します。すべての広告、+1などのボタンは更新パネルから除外されます。

于 2011-09-20T00:19:14.220 に答える