FreeTextBox

Hi,

Any chance in getting a version of freetextbox that will work inside of an atlas updatepanel ?

 

I have a simillar problem .

I have 2 FTBs on a page that contains an update panel to control some drop down lists. Whenever I remove the 2 FTBs from the page, the drop down list performs like it should. However, if I add an FTB onto the same page, the drop down list stops working. For some reason the Atlas panel is conflicting with the FTBs, although no error messages are thrown.

I am using version 3 and its really a bummer that the only workaround I can think off is to not use Atlas. Could I hope for a fix anytime soon?

Any luck with this yet ??

me too.

when can we get the answer???

FTB man, please come out and reply us

 

me too.

when can we get the answer???

FTB man, please come out and reply us

I just want to re-iterate the concern for this.  I also cannot get my freetextbox to work in an update panel.... I would really like to see this happen!

Just some day ago I found in a Blog (sorry I can't remember the source :( ) a quick and dirty trick to use atlas with freetextbox.
Just put the control in another page and call it in an iframe from the main (and atlas enabled) page.
Than you should only sincronize the content of the freetextbox with an hidden (for example) field in the main page. To to this I'm using the ClientSideTextChanged method of FreeTextBox control and two line of javascript (note that I send to the iframe page the control id of the hidden field as a query string paramether..)

Something like

// main page

[code code code]

<iframe src="ftb_control.aspx?<#tx_hidden.ClientID#>" width=xx height=yy></iframe>
<asp:textbox visible=false id="tx_hidden" />

[code code code]


// ftb_control.aspx
[code code code]

<script language=javascript>
function SendToParent(ftb)
{
    parent.document.getElementById('<%= Request.QueryString["text_id"] %>').value = ftb.GetHtml();
}
</script>


<form runat=server>
    <FTB:FreeTextBox ID="TxDescription" runat="server" Width="500" Height="200"
                            SupportFolder="~/FreeTextBox"
                            JavaScriptLocation="InternalResource"
                            ToolbarImagesLocation="InternalResource"
                            ButtonImagesLocation="InternalResource"
                            RenderMode="Rich"
                            ToolbarStyleConfiguration="OfficeXP"
                            ClientSideTextChanged="SendToParent"
                           />
                          
</form>

[code code code]

This work really nice with Internet Explorer and "so so" with firefox (1.5.0.3) because the sync with hidden field is done only when there is some mouse event instead of keydown as for Internet Explorer (I suppose that it's a FTB fault and / or javascript implementation issue...)

If you neet to initialize the freetext box to some default value you need some more javascript but I dind't found a nice solution for both IE and Firefox so I don't put anything here ;)

Hope this help.
Arf

Hi;

the trick worked but how can u have access to the text inside freetextbox?

and another problem is that the ftb control is not active when u click on it and wanna write sth.you should first change a font size or color and then it becomes active.whats the solution?

>the trick worked but how can u have access to the text inside freetextbox?

you can access the content using the hidden field in the main page (this is the reason because of there is the javascript function that copy the ftb text to that field..)

>and another problem is that the ftb control is not active when u click on it and wanna write sth.you >should first change a font size or color and then it becomes active.whats the solution?

Here I can't help.. maybe the Admin can answer...

By the way I switched off atlas on pages with FTB: too many problems for now :(

Any further news on this issue?  The iframe fix doesn't really fix the issue.  Is there any progress on FreeTextBox working within Atlas?

Thanks-

I'm looking for a text editor control that works with Atlas. I am not willing to jimmy-rig an iframe fix either. When this control works with Atlas I'll purchase it.

The iframe solution would be mine.

http://www.flanders.co.nz/Blog/2006/07/21/MakeTheFreetextboxWorkInsideAnAtlasUpdatpanel.aspx

I'm sorry but I'm not about to rewrite the code of freetextbox. That's a privilege I leave for the author of freetextbox.

casualjim-

Did you manage to get this working?  I tired but I can't seem to past problems with null Session values and empty QueryString values.  The thing is I need to use the control in several places on my site.  I don't think this solution can handle that type of task.

A big problem with the iframe solution is, you cant pass formatting ( <FONT> etc. ) through the hidden input field, the javascript that handles the onpageload for the textbox page will throw an error. The error may not pop up, but if you watch your status bar, you will see that there is an error and it will return to normal, except no text will be displayed.

I just created a workaround that allows ASP.Net Ajax and FreeTextBox to be in the same website.  Using javasript, a textbox and a placeholder, you can popup an alternate window with an instance of FreeTextBox (passing the data back and forth between the two pages).  The formatting will stick as well because the control.text property (html formatted string) is passed through a response.request variable.

I put in a request to have file upload rights to the forum, so I will post the file if I am granted that right. 

Heres the code:
----------------------------------------------------------------------------------------------------------------

Default.aspx
<%@ Page Language="VB" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="_Default" ValidateRequest="false" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

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

<head runat="server">

<title>Default - FreeTextBox Sample</title>

<link href="StyleSheet.css" rel="stylesheet" type="text/css" />

<script language="javascript" src="Scripts.js" type="text/javascript"></script>

</head>

<body>

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

<asp:ScriptManager ID="ScriptManager1" runat="server" />

<div>

Date:

<asp:TextBox ID="txtDate" runat="server" CssClass="Standard-Text" Width="200px"></asp:TextBox><br /><br />

<cc1:PopupControlExtender ID="PopupControlExtender1" runat="server" TargetControlID="txtDate" PopupControlID="pnlDate" Position="Bottom">

</cc1:PopupControlExtender>

<asp:TextBox ID="txtMessage" runat="server" CssClass="Standard-Text"></asp:TextBox><div style="overflow: auto; width: 450px; height: 325px" class="Table-Inner2">

<asp:PlaceHolder ID="phMessage" runat="server"></asp:PlaceHolder>

<a href="BLOCKED SCRIPTOpenFreeTextBox('txtMessage', true)">

<asp:Label ID="lblLaunchEditor" runat="server" Visible="False" Text="Click Here to Launch Text Editor"></asp:Label></a>

</div>

<a href="BLOCKED SCRIPTOpenFreeTextBox('txtMessage', true)">Launch Text Editor</a>

</div>

<asp:Panel ID="pnlDate" runat="server" CssClass="Popup-Control">

<asp:UpdatePanel ID="udpDate" runat="server">

<ContentTemplate>

<center>

<asp:Calendar ID="clDate" runat="server" BackColor="White" BorderColor="#999999"

CellPadding="1" DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt"

ForeColor="Black" Width="160px" OnSelectionChanged="clDate_SelectionChanged">

<SelectedDayStyle BackColor="#666666" Font-Bold="True" ForeColor="White" />

<TodayDayStyle BackColor="#CCCCCC" ForeColor="Black" />

<SelectorStyle BackColor="#CCCCCC" />

<WeekendDayStyle BackColor="#FFFFCC" />

<OtherMonthDayStyle ForeColor="#808080" />

<NextPrevStyle VerticalAlign="Bottom" />

<DayHeaderStyle BackColor="#CCCCCC" Font-Bold="True" Font-Size="7pt" />

<TitleStyle BackColor="#999999" Font-Size="7pt" BorderColor="Black" Font-Bold="True" />

</asp:Calendar>

</center>

</ContentTemplate>

</asp:UpdatePanel>

</asp:Panel>

</form>

</body>

</html>

 

Default.aspx.vb
Partial Class _Default

Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

'---Build dynamic tabs, inject into a placeholder

Dim objPagePart As PlaceHolder = Nothing

Dim objPanel As String = String.Empty

'---Get placeholder object

objPagePart = CType(FindControl("phMessage"), PlaceHolder)

If Not (objPagePart Is Nothing) And txtMessage.Text <> "" Then

phMessage.Visible = True

lblLaunchEditor.Visible = False

objPanel = txtMessage.Text

objPagePart.Controls.Add(New LiteralControl(objPanel))

Else

phMessage.Visible = False

lblLaunchEditor.Visible = True

End If

End Sub

#Region " Calendar Methods "

Protected Sub clDate_SelectionChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles clDate.SelectionChanged

PopupControlExtender1.Commit(clDate.SelectedDate.ToShortDateString)

End Sub

#End Region

End Class

 

PopupFTB.aspx
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="PopupFTB.aspx.vb" Inherits="Pages_FTB_PopupFTB" validateRequest="false"%>

<%@ Register Assembly="FreeTextBox" Namespace="FreeTextBoxControls" TagPrefix="FTB" %>

<!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>Text Editor - Milwaukee VA</title>

<link href="StyleSheet.css" rel="stylesheet" type="text/css" />

<script language="javascript" src="Scripts.js" type="text/javascript"></script>

</head>

<body>

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

<table width="100%" height="100%">

<tr valign="top">

<td>

<table width="100%" height="100%" class="Table-Inner1">

<tr>

<td>

<table width="100%" height="100%" class="Table-Inner2">

<tr>

<td>

<FTB:FreeTextBox id="ftbEditor" runat="server" Width="100%" Height="450px" ToolbarStyleConfiguration="Office2003"

ButtonSet="Office2003" EnableHtmlMode="False" PasteMode="Text" GutterBackColor="129, 169, 226" BackColor="158, 190, 245"

ToolbarLayout="FontFacesMenu,FontSizesMenu,FontForeColorsMenu;JustifyLeft,JustifyRight,JustifyCenter,JustifyFull|Bold,Italic,Underline,Strikethrough;BulletedList,NumberedList,Indent,Outdent,InsertRule|Cut,Copy,Paste;Undo,Redo"

FormatHtmlTagsToXhtml="False" AllowHtmlMode="True" ConvertHtmlSymbolsToHtmlCodes="False" ClientSideTextChanged="SetHiddenTextBox"></FTB:FreeTextBox>

</td>

</tr>

</table>

<input id="textwritten" type="hidden" name="textwritten" runat="server">

</td>

</tr>

<tr>

<td align="right">

<a href="BLOCKED SCRIPTCloseWindow()">

<asp:button id="btnCancel" runat="server" Text="Cancel" Width="60px" CssClass="Standard-Text"></asp:button>

</a>

<asp:Button ID="btnSave" runat="server" CssClass="Standard-Text" Text="Save" Width="60px" /></td>

</tr>

</table>

</td>

</tr>

</table>

</form>

</body>

</html>

 

PopupFTP.aspx.vb
Partial Class Pages_FTB_PopupFTB

Inherits System.Web.UI.Page

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

If Not Me.IsPostBack Then

Dim selected As String = Request.QueryString("selected")

Dim id As String = Request.QueryString("id")

Dim form As String = Request.QueryString("formname")

Dim postBack As String = Request.QueryString("postBack")

Try

ftbEditor.Text = selected

Catch ex As Exception

ftbEditor.Text = String.Empty

End Try

'---Add javascript to the save button so that when the user clicks on it, the selected html from the freetextbox

'---is passed back to the calling page.

'btnSave.Attributes.Add("onClick", "window.opener.SetFreeTextBox('" + form + "','" + id + "', document.ftbEditor.text," + postBack + ");")

btnSave.Attributes.Add("onClick", "window.opener.SetFreeTextBox('" + form + "','" + id + "',document.PopupFTB.textwritten.value," + postBack + ");")

btnCancel.Attributes.Add("onClick", "CloseWindow()")

End If

End Sub

Protected Sub ftbEditor_SaveClick(ByVal sender As Object, ByVal e As System.EventArgs) Handles ftbEditor.SaveClick

Dim selected As String = Request.QueryString("selected")

Dim id As String = Request.QueryString("id")

Dim form As String = Request.QueryString("formname")

Dim postBack As String = Request.QueryString("postBack")

btnSave.Attributes.Add("onClick", "window.opener.SetFreeTextBox('" + form + "','" + id + "','" + ftbEditor.Text + "'," + postBack + ");")

End Sub

End Class

 

Script.js
var popUp;

function OpenFreeTextBox(idname, postBack)

{

popUp = window.open('/FTPWAtlas/PopupFTB.aspx?formname=' + document.forms[0].name +

'&id=' + idname + '&selected=' + document.forms[0].elements[idname].value + '&postBack=' + postBack,

'popupcal', 'width=600,height=575,left=150,top=150');

}

function SetFreeTextBox(formName, id, newHtml, postBack) // Function for freetextbox 'Pages/FTB/PopupFTB.aspx'

{

eval('var theform = document.' + formName + ';');

popUp.close();

theform.elements[id].value = newHtml;

if (postBack)

__doPostBack(id,'');

}

function SetHiddenTextBox(ftb) {

var html = ftb.GetHtml();

var o = document.getElementById('textwritten');

o.value = ftb.GetHtml();

}

function CharCount(ftb) {

var html = ftb.GetHtml();

var o = document.getElementById('txtHiddenFTB');

o.value = html.length;

window.status = html.length;

}

function CloseWindow() // Function to close current page, used on cancel

{

self.close();

}

 

StyleSheet.css
body, div, p, h1, h2, h3, h4, ul, li, table

{

margin:0;

padding:0;

border:none;

}

body

{

background: #FFFFFF;

font-family: Verdana, Arial, Helvetica;

font-size: 11px;

}

.Standard-Text

{

font-family: Verdana, Arial, Helvetica;

font-size: 11px;

color: #000000;

}

.Table-Inner1

{

border-top: 1px solid #000080;

border-left: 1px solid #000080;

border-right: 1px solid #000080;

border-bottom: 1px solid #000080;

background-color: #cce7ff;

}

.Table-Inner2

{

border-top: 1px solid #000080;

border-left: 1px solid #000080;

border-right: 1px solid #000080;

border-bottom: 1px solid #000080;

background-color: #FFFFFF;

}

END

 

So basically the work around works by not having the Ajax.Net update panel in the PopupFTB.aspx page.  The placeholder on the parent page is not needed but does render html, so the user has a preview of the message with a link to edit.

Hope that this is of some use.

Thanks,
Josh