TextArea Resizing Extender for ASP.Net and .Net is a Failure

9/23/2008

Before I give you the code, I figured I'd share a list with you that I found on PC Magazine. Go to that link and notice number eight on the list... I had no idea that .Net was a failure. I mean everything else on that list makes sense, but .Net? You might as well put the iPhone on the next page then because it only sold 5 million or so last quarter... I will say though that Android looks pretty sweet though and I could see it taking over, but Google isn't "elitist" like Apple (which seems to work for Apple for some reason, I just find it annoying though). Then again I hate cell phones, so meh... Now if Google comes out with a music player that doesn't tie me to an iTunes like system (not to mention a proprietary format), with perhaps a web based storage system for my music, not to mention FM radio, legal sharing of songs, etc. I'd be all over that.  So basically I'm asking for a Zune with a couple extra features and doesn't suck, I guess (Although the next version looks promising).

Anyway, on to the code. This is another extender (once again, really basic). All this extender does is increases/decreases the size of a text area whenever someone types in it (thus making it so that they don't have to scroll). And as always I've packaged this one in a nice little zip file (note that you're going to need the AJAX Toolkit to get it working most likely):

TextAreaResizerExtender.cs

   1: using System;
   2: using System.Web.UI.WebControls;
   3: using System.Web.UI;
   4: using System.ComponentModel;
   5: using System.ComponentModel.Design;
   6: using AjaxControlToolkit;
   7:  
   8: [assembly: System.Web.UI.WebResource("AJAXControls.TextAreaResizer.TextAreaResizerBehavior.js", "text/javascript")]
   9:  
  10: namespace AJAXControls.TextAreaResizer
  11: {
  12:     [Designer(typeof(TextAreaResizerDesigner))]
  13:     [ClientScriptResource("AJAXControls.TextAreaResizer.TextAreaResizerBehavior", "AJAXControls.TextAreaResizer.TextAreaResizerBehavior.js")]
  14:     [TargetControlType(typeof(Control))]
  15:     public class TextAreaResizerExtender : ExtenderControlBase
  16:     {
  17:     }
  18: }

TextAreaResizerBehavior.js

   1: // README
   2: //
   3: // There are two steps to adding a property:
   4: //
   5: // 1. Create a member variable to store your property
   6: // 2. Add the get_ and set_ accessors for your property
   7: //
   8: // Remember that both are case sensitive!
   9:  
  10:  
  11: /// <reference name="MicrosoftAjaxTimer.debug.js" />
  12: /// <reference name="MicrosoftAjaxWebForms.debug.js" />
  13: /// <reference name="AjaxControlToolkit.ExtenderBase.BaseScripts.js" assembly="AjaxControlToolkit" />
  14:  
  15:  
  16: Type.registerNamespace('AJAXControls.TextAreaResizer');
  17:  
  18: AJAXControls.TextAreaResizer.TextAreaResizerBehavior = function(element) {
  19:     AJAXControls.TextAreaResizer.TextAreaResizerBehavior.initializeBase(this, [element]);
  20:  
  21:     // TODO : (Step 1) Add your property variables here
  22:     this._Width = 0;
  23:     this._Height = 0;
  24:     this._CurrentRows = 0;
  25:     this._MinRows = 0;
  26: }
  27: AJAXControls.TextAreaResizer.TextAreaResizerBehavior.prototype = {
  28:     initialize: function() {
  29:         AJAXControls.TextAreaResizer.TextAreaResizerBehavior.callBaseMethod(this, 'initialize');
  30:  
  31:         // TODO: Add your initalization code here
  32:         Sys.UI.DomEvent.addHandler(this.get_element(), 'keyup',
  33:             Function.createDelegate(this, this._onkeyup));
  34:         this._MinRows = this.get_element().rows;
  35:         var Rows = this.get_element().value.split('\n');
  36:         this._CurrentRows = Rows.length;
  37:         var NumberCols = this.get_element().cols;
  38:         for (var x = 0; x < Rows.length; ++x) {
  39:             var Line = Rows[x];
  40:             if (Line.length >= NumberCols) {
  41:                 this._CurrentRows += Math.floor(Line.length / NumberCols);
  42:             }
  43:         }
  44:         if (this._CurrentRows + 2 >= this._MinRows) {
  45:             this.get_element().rows = this._CurrentRows + 2;
  46:         }
  47:         else {
  48:             this.get_element().rows = this._MinRows;
  49:         }
  50:     },
  51:  
  52:     _onkeyup: function() {
  53:         var OldNumberRows = this.get_element().rows;
  54:         var Rows = this.get_element().value.split('\n');
  55:         this._CurrentRows = Rows.length;
  56:         var NumberCols = this.get_element().cols;
  57:         for (var x = 0; x < Rows.length; ++x) {
  58:             var Line = Rows[x];
  59:             if (Line.length >= NumberCols) {
  60:                 this._CurrentRows += Math.floor(Line.length / NumberCols);
  61:             }
  62:         }
  63:         if (this._CurrentRows + 2 >= this._MinRows) {
  64:             this.get_element().rows = this._CurrentRows + 2;
  65:         }
  66:         else {
  67:             this.get_element().rows = this._MinRows;
  68:         }
  69:     },
  70:  
  71:     dispose: function() {
  72:         // TODO: Add your cleanup code here
  73:  
  74:         AJAXControls.TextAreaResizer.TextAreaResizerBehavior.callBaseMethod(this, 'dispose');
  75:     }
  76: }
  77: AJAXControls.TextAreaResizer.TextAreaResizerBehavior.registerClass('AJAXControls.TextAreaResizer.TextAreaResizerBehavior', AjaxControlToolkit.BehaviorBase);

I'm sure this extender could be useful in certain situations but I have no idea what they would be. I really just created this one because I was bored... Basically I'm stuck creating reports at the moment and it's not exactly the most challenging work... Time consuming, but not that challenging.  Anyway, download the code, give it a try, leave feedback, and happy coding.



Comments