ajaxを使ってコードビハインドからjavascriptを呼び出す

私はasp.netユーザーコントロールを作成して、モーダルポップアップのすべてのフォーム（エラー処理、フォーム、ダイアログなど）を処理するという考えを持っています。ajaxを使ってコードビハインドからjavascriptを呼び出す

私はすでに、すべてのコンテンツページにさらす、トップマスターページにユーザーコントロールを配置し、この前に作成したので、私はのような何かができる：

Master.Popup.ShowException(Exception);

そしてユーザーコントロール自体は必要なマークアップを持っているでしょうモーダルダイアログのように見えるようにするには、showメソッドで.Visible = trueを実行します。

これはすべて問題ありませんが、jqueryで少しのスタイルを実装することを考え始めました。私は、ユーザーコントロールにjqueryアニメーションを表示するようにしたいと思います。しかし、私はpopup.visible = trueの代わりにコードビハインドからjquery関数を呼び出す方法がわからないので、これを達成する方法を知りません。

誰でも私に可能な解決策を提供できますか？あなたのMaster.Popup.ShowException（....）インサイド

出典

2011-02-16 Dynde

はこのようなものを使用します。animateMyBox（...）は、あなたがやりたい方アニメーションです

ScriptManager.RegisterStartupScript(Page, Page.GetType(), "animateJS", "animateMyBox('popupid');", true);

。最後に、popup.display = "block"を実行します。

また、アニメーション後に実行するコードをアニメーション化する関数を渡すことができるかどうかを調べます。等：

animateMyBox('popupid', function() { document.getElementById('popupid').display='block'; })

別の可能性は、0から100％の不透明度をアニメーションのような終わりに見えているボックスに終わるであろうアニメーションを使用することです。

私はこれがあいまいだと知っていますが、より良い回答を得るには、より多くのコードを共有する必要があります。

出典

2011-02-16 08:38:13

あなたはjavascriptをレンダリングするコントロールを作成することができます：私はあなたが実行したいエフェクト名であるプロパティEffectTypeを定義している

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Web; 
using System.ComponentModel; 
using System.Web.UI; 
using System.Web.UI.WebControls; 
using System.Text; 

namespace WebApplication1 
{ 
    [DefaultProperty("EffectType"), ToolboxData("<{0}:jQueryAnimation runat=server></{0}:jQueryAnimation>")] 
    public class jQueryAnimation : System.Web.UI.WebControls.WebControl 
    { 
     private const string SCRIPT_KEY = "jQueryAnimation"; 

     [Bindable(true), Category("Appearance"), DefaultValue("Bounce")] 
     public string EffectType { get; set; } 
     public string ControlId { get; set; } 

     protected override void OnPreRender(EventArgs e) 
     { 
      base.OnPreRender(e); 
      RegisterAnimationScript(); 
     } 

     protected override void RenderContents(HtmlTextWriter writer) 
     { 
      base.RenderContents(writer); 
     } 

     private void RegisterAnimationScript() 
     { 
      if (!Page.ClientScript.IsClientScriptBlockRegistered(SCRIPT_KEY)) 
      { 

       StringBuilder script = new StringBuilder(); 
       script.Append("<script type='text/javascript'>"); 
       script.Append(Environment.NewLine); 
       script.Append("$(document).ready(function() {"); 
       script.Append(Environment.NewLine); 
       script.Append("var options = {};"); 
       script.Append(Environment.NewLine); 
       script.Append("$('#"); 
       script.Append(this.ControlId); 
       script.Append("').effect('"); 
       script.Append(this.EffectType); 
       script.Append("', options, 1500, "); 
       script.Append(this.ControlId); 
       script.Append("_callback);"); 
       script.Append(Environment.NewLine); 
       script.Append("function "); 
       script.Append(this.ControlId); 
       script.Append("_callback() {"); 
       script.Append(Environment.NewLine); 
       script.Append("setTimeout(function() {"); 
       script.Append("$('#"); 
       script.Append(this.ControlId); 
       script.Append("').removeAttr('style').hide().fadeIn();"); 
       script.Append("}, 1000);};"); 
       script.Append(Environment.NewLine); 
       script.Append("});"); 
       script.Append(Environment.NewLine); 
       script.Append("</script>"); 

       Page.ClientScript.RegisterClientScriptBlock(Page.GetType(),SCRIPT_KEY,script.ToString()); 
      } 
     } 
    } 
}

を。 ControlIdは、アニメートするHTML要素のIDです。
RegisterAnimationScriptは、アニメーションを行うためのjavascriptを出力します。あなたは

<%@ Register assembly="WebApplication1" namespace="WebApplication1" tagprefix="cc1" %>

コントロールを登録して、ここで

<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
    <title></title> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.min.js"></script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <div id="test" style="width:100px;height:100px;background-color:Red">&nbsp;</div> 
     <cc1:jQueryAnimation ID="jQueryAnimation1" runat="server" EffectType="Shake" ControlId="test"></cc1:jQueryAnimation> 
    </div> 
    </form> 
</body> 
</html>

（それはあなたのツールボックスに表示されます）あなたのコントロールをドロップする必要があなたのASPXで、私はに私のserer制御jQueryAnimationをバインドしましたdivテスト（ControlId="test"）と私が適用したい効果を定義しました（EffectType="Shake"）。
C＃でjavascriptを管理するのは非常に簡単ですが、;-)

出典

2011-02-16 09:54:54 LeftyX

ajaxを使ってコードビハインドからjavascriptを呼び出す

答えて

関連する問題