CTextBox: Keep size between postbacks when resized.

This commit is contained in:
2017-04-04 23:54:19 +02:00
parent 3b480c58ca
commit 3ede7ea52c
6 changed files with 155 additions and 17 deletions

View File

@@ -1,13 +1,20 @@
using System;
using System.Collections.Generic;
using System.Text;
using System.Web.UI;
using System.Web.UI.WebControls;
using VAR.Json;
namespace VAR.Focus.Web.Controls
{
public class CTextBox : TextBox, IValidableControl
public class CTextBox : Control, INamingContainer, IValidableControl
{
#region Declarations
private TextBox _txtContent = new TextBox();
private HiddenField _hidSize = null;
private const string CssClassBase = "textbox";
private string _cssClassExtra = "";
@@ -19,6 +26,8 @@ namespace VAR.Focus.Web.Controls
private Control _nextFocusOnEnter = null;
private bool _keepSize = false;
#endregion Declarations
#region Properties
@@ -53,44 +62,93 @@ namespace VAR.Focus.Web.Controls
set { _nextFocusOnEnter = value; }
}
public bool KeepSize
{
get { return _keepSize; }
set { _keepSize = value; }
}
public string Text
{
get { return _txtContent.Text; }
set { _txtContent.Text = value; }
}
public TextBoxMode TextMode
{
get { return _txtContent.TextMode; }
set { _txtContent.TextMode = value; }
}
#endregion Properties
#region Control life cycle
public CTextBox()
{
Init += CTextBox_Init;
PreRender += CTextbox_PreRender;
}
private void CTextBox_Init(object sender, EventArgs e)
{
Controls.Add(_txtContent);
if (TextMode == TextBoxMode.MultiLine)
{
if (_keepSize)
{
_hidSize = new HiddenField();
Controls.Add(_hidSize);
}
string strCfgName = string.Format("{0}_cfg", this.ClientID);
Dictionary<string, object> cfg = new Dictionary<string, object>
{
{"txtContent", _txtContent.ClientID},
{"hidSize", _hidSize.ClientID},
{"keepSize", _keepSize },
};
JsonWriter jsonWriter = new JsonWriter();
StringBuilder sbCfg = new StringBuilder();
sbCfg.AppendFormat("<script>\n");
sbCfg.AppendFormat("var {0} = {1};\n", strCfgName, jsonWriter.Write(cfg));
sbCfg.AppendFormat("CTextBox_Multiline_Init({0});\n", strCfgName);
sbCfg.AppendFormat("</script>\n");
LiteralControl liScript = new LiteralControl(sbCfg.ToString());
Controls.Add(liScript);
}
}
private void CTextbox_PreRender(object sender, EventArgs e)
{
CssClass = CssClassBase;
_txtContent.CssClass = CssClassBase;
if (string.IsNullOrEmpty(_cssClassExtra) == false)
{
CssClass = string.Format("{0} {1}", CssClassBase, _cssClassExtra);
_txtContent.CssClass = string.Format("{0} {1}", CssClassBase, _cssClassExtra);
}
if (Page.IsPostBack && (_allowEmpty == false && IsEmpty()) || _markedInvalid)
{
CssClass += " textboxInvalid";
_txtContent.CssClass += " textboxInvalid";
}
Attributes.Add("onchange", "ElementRemoveClass(this, 'textboxInvalid');");
_txtContent.Attributes.Add("onchange", "ElementRemoveClass(this, 'textboxInvalid');");
if (string.IsNullOrEmpty(_placeHolder) == false)
{
Attributes.Add("placeholder", _placeHolder);
_txtContent.Attributes.Add("placeholder", _placeHolder);
}
if (_nextFocusOnEnter != null)
{
this.Attributes.Add("onkeydown", string.Format(
_txtContent.Attributes.Add("onkeydown", string.Format(
"if(event.keyCode==13){{document.getElementById('{0}').focus(); return false;}}",
_nextFocusOnEnter.ClientID));
}
// FIX: The framework deletes textbox values on password mode
if (TextMode == TextBoxMode.Password)
if (_txtContent.TextMode == TextBoxMode.Password)
{
Attributes["value"] = Text;
_txtContent.Attributes["value"] = _txtContent.Text;
}
}
@@ -100,12 +158,12 @@ namespace VAR.Focus.Web.Controls
public bool IsEmpty()
{
return string.IsNullOrEmpty(Text);
return string.IsNullOrEmpty(_txtContent.Text);
}
public bool IsValid()
{
return _allowEmpty || (string.IsNullOrEmpty(Text) == false);
return _allowEmpty || (string.IsNullOrEmpty(_txtContent.Text) == false);
}
#endregion Public methods

View File

@@ -15,8 +15,8 @@ namespace VAR.Focus.Web.Pages
private int _idBoard = 0;
private CTextBox _txtTitle = new CTextBox { ID = "txtTitle", CssClassExtra = "width100pc", AllowEmpty = false };
private CTextBox _txtDescription = new CTextBox { ID = "txtDescription", CssClassExtra = "width100pc", TextMode = TextBoxMode.MultiLine };
private CTextBox _txtTitle = new CTextBox { ID = "txtTitle", CssClassExtra = "width100pc", AllowEmpty = false, };
private CTextBox _txtDescription = new CTextBox { ID = "txtDescription", CssClassExtra = "width100pc", TextMode = TextBoxMode.MultiLine, KeepSize = true, };
#endregion Declarations

View File

@@ -15,7 +15,7 @@ namespace VAR.Focus.Web.Pages
private int _idBoard = 0;
private CTextBox _txtTitle = new CTextBox { ID = "txtTitle", CssClassExtra = "width100pc", AllowEmpty = false };
private CTextBox _txtDescription = new CTextBox { ID = "txtDescription", CssClassExtra = "width100pc", TextMode = TextBoxMode.MultiLine };
private CTextBox _txtDescription = new CTextBox { ID = "txtDescription", CssClassExtra = "width100pc", TextMode = TextBoxMode.MultiLine, KeepSize = true, };
private CButton _btnSave = new CButton { ID = "btnSave" };
private CButton _btnExit = new CButton { ID = "btnExit" };

View File

@@ -13,8 +13,8 @@ namespace VAR.Focus.Web.Pages
private Panel _pnlRegister = new Panel { ID = "pnlRegister" };
private CTextBox _txtName = new CTextBox { ID = "txtName", CssClassExtra = "width150px", AllowEmpty = false };
private CTextBox _txtEmail = new CTextBox { ID = "txtEmail", CssClassExtra = "width150px", AllowEmpty = false };
private CTextBox _txtPassword1 = new CTextBox { ID = "txtPassword1", CssClass = "width150px", AllowEmpty = false, TextMode = TextBoxMode.Password };
private CTextBox _txtPassword2 = new CTextBox { ID = "txtPassword2", CssClass = "width150px", AllowEmpty = false, TextMode = TextBoxMode.Password };
private CTextBox _txtPassword1 = new CTextBox { ID = "txtPassword1", CssClassExtra = "width150px", AllowEmpty = false, TextMode = TextBoxMode.Password };
private CTextBox _txtPassword2 = new CTextBox { ID = "txtPassword2", CssClassExtra = "width150px", AllowEmpty = false, TextMode = TextBoxMode.Password };
private CButton _btnRegister = new CButton { ID = "btnRegister" };
private CButton _btnExit = new CButton { ID = "btnExit" };
private Panel _pnlSuccess = new Panel { ID = "pnlSuccess" };

View File

@@ -0,0 +1,79 @@
////////////////////////
// CTextBox_Multilin_SetText
//
var CTextBox_SetText = function (id, text) {
var element = document.getElementById(id);
element.value = text;
}
////////////////////////
// CTextBox_Multiline_KeyDown
//
var CTextBox_Multiline_KeyDown = function (e) {
if (e.keyCode == 9 || e.which == 9) {
e.preventDefault();
var s = this.selectionStart;
this.value = this.value.substring(0, this.selectionStart) + "\t" + this.value.substring(this.selectionEnd);
this.selectionEnd = s + 1;
}
};
////////////////////////
// CTextBox_Multiline_SaveSizeData
//
var CTextBox_Multiline_SaveSizeData = function (textArea) {
var hidSizeData = document.getElementById(textArea.cfg.hidSize);
hidSizeData.value = JSON.stringify(textArea.cfg.size);
}
////////////////////////
// CTextBox_Multiline_RestoreSizeData
//
var CTextBox_Multiline_RestoreSizeData = function (textArea) {
var hidSizeData = document.getElementById(textArea.cfg.hidSize);
if (hidSizeData.value !== "") {
textArea.cfg.size = JSON.parse(hidSizeData.value);;
textArea.style.width = textArea.cfg.size.width + "px";
textArea.style.height = textArea.cfg.size.height + "px";
textArea.scrollTop = textArea.cfg.size.scrollTop;
}
textArea.cfg.size = { height: textArea.offsetHeight, scrollTop: textArea.scrollTop };
}
////////////////////////
// CTextBox_Multiline_MouseUp
//
var CTextBox_Multiline_MouseUp = function (e) {
var textArea = e.target;
var newSize = { height: textArea.offsetHeight, width: textArea.offsetWidth, scrollTop: textArea.scrollTop };
if (textArea.cfg.size.height != newSize.height) {
textArea.cfg.size = newSize;
CTextBox_Multiline_SaveSizeData(textArea);
}
}
////////////////////////
// CTextBox_Multiline_Scrolled
//
var CTextBox_Multiline_Scrolled = function (e) {
var textArea = e.target;
textArea.cfg.size = { height: textArea.offsetHeight, scrollTop: textArea.scrollTop };
CTextBox_Multiline_SaveSizeData(textArea);
}
////////////////////////
// CTextBox_Multiline_Init
//
var CTextBox_Multiline_Init = function (cfg) {
var textArea = document.getElementById(cfg.txtContent);
textArea.cfg = cfg;
textArea.onkeydown = CTextBox_Multiline_KeyDown;
if (cfg.keepSize) {
CTextBox_Multiline_RestoreSizeData(textArea);
textArea.onmouseup = CTextBox_Multiline_MouseUp;
textArea.onscroll = CTextBox_Multiline_Scrolled;
}
}

View File

@@ -66,6 +66,7 @@
</ItemGroup>
<ItemGroup>
<Content Include="Scripts\02. Ajax.js" />
<Content Include="Scripts\03. Controls.js" />
<Content Include="Scripts\05. Cards.js" />
<Content Include="Scripts\10. Chat.js" />
<Content Include="Styles\00. Reset.css" />