Extending Ext.Net.TextField Control

  1. #1

    [CLOSED] Extending Ext.Net.TextField Control

    Hi,

    I want to extend textfield to add new properties to it, basically one of each is the most important. The new control is named "SearchTextField".

    I extend the control, correctly or it seems :p
    But when I access to the page who have it, create method of Ext.Component says that the type 'searchtextfield' is undefined and it expects an object.

    Here is my piece of code:

    Javascript
    Ext.namespace('Ext.ux.form');
    
    Ext.ux.form.SearchTextField = function (config) {
        Ext.ux.form.SearchTextField.superclass.constructor.call(this, config);
    };
    
    Ext.ux.form.SearchTextField = Ext.extend(Ext.form.TextField, {
    
        searchModeEnabled: true,
        failureFn: null,
        successFn: null,
        searchUrl: null,
        extraParameterName: 'identificador',
    
        initComponent: function () {
            Ext.ux.form.SearchTextField.superclass.initComponent.call(this);
        },
    
        // private
        initEvents: function () {
            Ext.ux.form.SearchTextField.superclass.initEvents.call(this);
        },
    
        onRender: function (ct, position) {
            Ext.ux.form.SearchTextField.superclass.onRender.call(this, ct, position);
        }
    });
    
    Ext.reg('searchtextfield', Ext.ux.form.SearchTextField);
    C#
    public class SearchTextField : Ext.Net.TextField
        {
            #region Constants
    
            const string searchCls = "search";
    
            #endregion
    
            #region Members
    
            bool _isBaseInitialized = false;
            bool _searchModeEnabled = true;
            string _failureHandler;
            string _successHandler;
            string _searchUrl;
            string _extraParameterName = "identificador";
    
            #endregion
    
            #region Properties
    
            #region Custom
    
            /// <summary>
            /// Get or set if the search mode is enabled. Default value 'true'
            /// </summary>
            [DefaultValue(true)]
            public bool SearchModeEnabled
            {
                get { return _searchModeEnabled; }
                set
                {
                    _searchModeEnabled = value;
                    this.SearchModeStyles();
                }
            }
    
            /// <summary>
            /// Name of the javascript function that raises if anything else goes wrong
            /// </summary>
            [DefaultValue(null)]
            public string FailureFn
            {
                get { return _failureHandler; }
                set { _failureHandler = value; }
            }
    
    
            [DefaultValue(null)]
            public string SuccessFn
            {
                get { return _successHandler; }
                set { _successHandler = value; }
            }
    
            /// <summary>
            /// Url to the controller that makes the search with an specified parameter
            /// </summary>
            [DefaultValue(null)]
            public string SearchUrl
            {
                get { return _searchUrl; }
                set { _searchUrl = value; }
            }
    
            /// <summary>
            /// Name of the parameter that the controller expects. Default value is 'identificador'
            /// </summary>
            [DefaultValue("identificador")]
            public string ExtraParameterName
            {
                get { return _extraParameterName; }
                set { _extraParameterName = value; }
            }
    
            #endregion
    
            #region Override
    
            /// <summary>
            /// Generates extra properties for search text field to interact in javascript
            /// </summary>
            [Browsable(false)]
            [EditorBrowsable(EditorBrowsableState.Never)]
            [DesignerSerializationVisibility(DesignerSerializationVisibility.Hidden)]
            [XmlIgnore]
            [JsonIgnore]
            public override ConfigOptionsCollection ConfigOptions
            {
                get
                {
                    ConfigOptionsCollection list = base.ConfigOptions;
    
                    list.Add("searchModeEnabled", new ConfigOption("searchModeEnabled", null, true, this.SearchModeEnabled));
                    list.Add("failureFn", new ConfigOption("failureFn", null, null, this.FailureFn));
                    list.Add("successFn", new ConfigOption("successFn", null, null, this.SuccessFn));
                    list.Add("searchUrl", new ConfigOption("searchUrl", null, null, this.SearchUrl));
                    list.Add("extraParameterName", new ConfigOption("extraParameterName", null, "identificador", this.ExtraParameterName));
    
                    return list;
                }
            }
    
            /// <summary>
            /// Add the resources for this control
            /// </summary>
            [Description("")]
            protected override List<ResourceItem> Resources
            {
                get
                {
                    List<ResourceItem> baseList = base.Resources;
    
                    baseList.Capacity += 1;
    
                    ClientScriptItem js = new ClientScriptItem(typeof(SearchTextField), "MyNamespace.Resources.js.SearchTextField.js", "/ux/extensions/searchtextfield/searchtextfield.js");
    
                    baseList.Add(js);
    
                    return baseList;
                }
            }
    
            /// <summary>
            /// 
            /// </summary>
            [Category("0. About")]
            [Description("")]
            public override string InstanceOf
            {
                get
                {
                    return "Ext.ux.form.SearchTextField";
                }
            }
    
            public override string XType
            {
                get
                {
                    return "searchtextfield";
                }
            }
    
            #endregion
    
            #endregion
    
            #region Constructors
    
            public SearchTextField()
                : base()
            {
            }
    
            public SearchTextField(Config config)
                : base(config)
            {
            }
    
            public SearchTextField(string text)
                : base(text)
            {
            }
    
            #endregion
    
            #region Methods
    
            private void SetJavascriptEvents()
            {
                //Blur Listener
                this.Listeners.Blur.Handler = "return this.getEl().hasClass('" + searchCls + "');";
    
                this.DataBind();
    
                //Blur Direct Event
                if (!string.IsNullOrEmpty(this.SearchUrl))
                {
                    this.DirectEvents.Blur.Url = this.SearchUrl;
    
                    if (!string.IsNullOrEmpty(this.FailureFn))
                        this.DirectEvents.Blur.Failure = this.FailureFn;
    
                    Ext.Net.ParameterCollection extraParams = new Ext.Net.ParameterCollection(true);
                    extraParams.Add(new Ext.Net.Parameter(this.ExtraParameterName, this.Text, Ext.Net.ParameterMode.Raw));
                }
            }
    
            private void SearchModeStyles()
            {
                if (_isBaseInitialized)
                {
                    if (this.SearchModeEnabled)
                    {
                        this.AddClass(searchCls);
                    }
                    else
                    {
                        this.RemoveClass(searchCls);
                    }
                }
            }
    
            #endregion
    
            #region Events
    
            protected override void OnInit(EventArgs e)
            {
                base.OnInit(e);
    
                _isBaseInitialized = true;
    
                this.SetJavascriptEvents();
    
                this.SearchModeStyles();
            }
    
            #endregion
        }
    All I want to do is access to preperty SearchModeEnabled in c# through Javascript like the other Ext Net Components to modify it.

    I follow the instructions in these posts
    Last edited by David Pelaez; Dec 22, 2010 at 10:44 AM. Reason: CLOSED
  2. #2

    CLOSED

    Sorry I was mistaking to embed like a resource the javascript file.

    It is correct.

Similar Threads

  1. Custom Server Control Textfield
    By m_bo in forum 1.x Help
    Replies: 3
    Last Post: Mar 30, 2012, 9:21 AM
  2. [CLOSED] Need for a composite control extending Ext.NET
    By Aparna_B in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Nov 10, 2011, 5:38 PM
  3. [CLOSED] Creating a control by extending the ext:TextField control
    By Shanth in forum 1.x Legacy Premium Help
    Replies: 7
    Last Post: Sep 12, 2011, 2:58 PM
  4. [CLOSED] Using format for TextField control
    By flormariafr in forum 1.x Legacy Premium Help
    Replies: 15
    Last Post: Jul 21, 2010, 4:10 PM
  5. Replies: 0
    Last Post: Jun 24, 2009, 4:53 PM

Tags for this Thread

Posting Permissions