Ajax与FreeTextBox解决方案

目前还不能找到与 Ajax UpdatePanel 协同工作的在线Html编辑控件线给出我在工作项跟踪管理系统中的IFrame解决方案

Web.config 文件中的配置

<pages  validateRequest="false">

      <controls>

        <add tagPrefix="Ajax"

            namespace="Microsoft.Web.UI"

            assembly="Microsoft.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

        <add tagPrefix="Ajax"

            namespace="Microsoft.Web.UI.Controls"

            assembly="Microsoft.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>

        <add tagPrefix="FTB"

            namespace="FreeTextBox"

            assembly="FreeTextBox" />

        <add tagPrefix="WITUC"

            src="~/UserControls/HtmlEditorWrapper.ascx"

            tagName="HtmlEditorWrapper" />

      </controls>

</pages>

<httpHandlers>

    <add verb="GET"

          path="FtbWebResource.axd"

          type="FreeTextBoxControls.AssemblyResourceHandler, FreeTextBox"/>

</httpHandlers>

IFrame需要装载的代理页:

FreeTextBoxPage.aspx 文件

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="FreeTextBoxPage.aspx.cs" Inherits="AIO.WITWeb.FreeTextBoxPage" %>

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

  <title>FreeTextBoxWraper</title>

  <style type="text/css">

    body

    {

      background:#ffdaa0;

      margin:0;

    }

  </style>

</head>

<body>

  <form id="form1" runat="server">

    <div>

      <FTB:FreeTextBox ID="Editor" runat="server" Focus="false" EnableHtmlMode="True" Height="257px" ClientSideTextChanged="Editor_OnClientTextChanged" RenderMode="Rich" ToolbarStyleConfiguration="Office2003" Width="100%">

      </FTB:FreeTextBox>

    </div>

 

    <script type="text/javascript">

      function Editor_OnClientTextChanged()

      {

        window.parent.document.getElementById('<%= HtmlEditorHiddenFieldID %>').value = document.getElementById('<%= Editor.ClientID %>_designEditor').contentWindow.document.body.innerHTML;

      };

      if(navigator.userAgent.indexOf("Firefox")!=-1)

        document.getElementById("<%= Editor.ClientID %>_htmlEditorArea").addEventListener('change', Editor_OnClientTextChanged, true);

    </script>

 

  </form>

</body>

</html>

FreeTextBoxPage.aspx.cs 文件

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

 

namespace AIO.WITWeb

{

  public partial class FreeTextBoxPage : System.Web.UI.Page

  {

    protected string HtmlEditorHiddenFieldID;

 

    protected void Page_Load(object sender, EventArgs e)

    {

      HtmlEditorHiddenFieldID = Request.QueryString["HtmlEditorHiddenFieldID"];

      if (!IsPostBack)

      {

        Editor.Text = Session[HtmlEditorHiddenFieldID].ToString();

      }

    }

 

    public string Text

    {

      get

      {

        return this.Editor.Text;

      }

      set

      {

        this.Editor.Text = value;

      }

    }

  }

}

 

宿主用户控件:

HtmlEditorWrapper.ascx

 

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="HtmlEditorWrapper.ascx.cs" Inherits="AIO.WITWeb.HtmlEditorWrapper" %>

<asp:DropDownList ID="EditorTypeDropDownList" runat="server" AutoPostBack="true" Visible="false" OnSelectedIndexChanged="EditorTypeDropDownList_OnSelectedIndexChanged">

  <asp:ListItem Text="FCKEditor" Value="~/UserControls/FCKEditorPage.aspx"></asp:ListItem>

  <asp:ListItem Text="FreeTextBox" Value="~/UserControls/FreeTextBoxPage.aspx" Selected="True"></asp:ListItem>

  <asp:ListItem Text="CuteEditor" Value="~/UserControls/CuteEditorPage.aspx"></asp:ListItem>

</asp:DropDownList>

<Ajax:UpdatePanel ID="EditorIFrameUpdatePanel" runat="server" UpdateMode="Conditional" RenderMode="Block">

 <Triggers>

    <Ajax:AsyncPostBackTrigger ControlID="EditorTypeDropDownList" EventName="SelectedIndexChanged" />

  </Triggers>

  <ContentTemplate>

    <asp:HiddenField ID="HtmlEditorHiddenField" runat="server" />

    <AIO:IFrame ID="EditorIFrame" runat="server" Height="350px" Scroll="No" Width="100%" />

  </ContentTemplate>

</Ajax:UpdatePanel>

 

<script type="text/javascript">

var iframeids=["EditorIFrame"]

var iframehide="yes"

 

function dyniframesize()

{

  var dyniframe=new Array()

  for (i=0; i<iframeids.length; i++)

  {

  if (document.getElementById)

  {

    dyniframe[dyniframe.length] = document.getElementById(iframeids[i]);

    if (dyniframe[i] && !window.opera)

    {

    dyniframe[i].style.display="block"

    if (dyniframe[i].contentDocument && dyniframe[i].contentDocument.body.offsetHeight)

      dyniframe[i].height = dyniframe[i].contentDocument.body.offsetHeight;

    else if (dyniframe[i].Document && dyniframe[i].Document.body.scrollHeight)

      dyniframe[i].height = dyniframe[i].Document.body.scrollHeight;

    }

  }

 

  if ((document.all || document.getElementById) && iframehide=="no")

  {

    var tempobj=document.all? document.all[iframeids[i]] : document.getElementById(iframeids[i])

    tempobj.style.display="block"

  }

  }

}

 

if (window.addEventListener)

  window.addEventListener("load", dyniframesize, false)

else if (window.attachEvent)

  window.attachEvent("onload", dyniframesize)

else

  window.onload=dyniframesize

</script>

 

HtmlEditorWrapper.ascx.cs

 

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

 

namespace AIO.WITWeb

{

  public partial class HtmlEditorWrapper : System.Web.UI.UserControl

  {

    public string Text

    {

      get

      {

        return HtmlEditorHiddenField.Value;

      }

      set

      {

        HtmlEditorHiddenField.Value = value;

      }

    }

 

    protected void Page_Load(object sender, EventArgs e)

    {

      EditorIFrame.NavigateURL = ResolveUrl(String.Format("{0}?HtmlEditorHiddenFieldID={1}", EditorTypeDropDownList.SelectedValue, HtmlEditorHiddenField.ClientID));

      if (!IsPostBack)

      {

        if (ShowEditorType)

        {

          EditorTypeDropDownList.Visible = true;

        }

        Session[HtmlEditorHiddenField.ClientID] = HtmlEditorHiddenField.Value;

      }

    }

 

    public bool ShowEditorType

    {

      get

      {

        return (ViewState["ShowEditorType"] == null) ? false : (bool)ViewState["ShowEditorType"];

      }

      set

      {

        ViewState["ShowEditorType"] = value;

      }

    }

 

    protected override void OnDataBinding(EventArgs e)

    {

      base.OnDataBinding(e);

      Session[HtmlEditorHiddenField.ClientID] = HtmlEditorHiddenField.Value;

    }

 

    protected void EditorTypeDropDownList_OnSelectedIndexChanged(object sender, EventArgs e)

    {

      EditorIFrame.NavigateURL = ResolveUrl(String.Format("{0}?HtmlEditorHiddenFieldID={1}", EditorTypeDropDownList.SelectedValue, HtmlEditorHiddenField.ClientID));

    }

  }

}

 

使用代码:

<WITUC:HtmlEditorWrapper ID="DescriptionHtmlEditorWrapper" runat="server" ShowEditorType="false" Text='<%# Bind("Description") %>' />

 

你可能感兴趣的:(Ajax)