[CLOSED] After UserControl rewrite javascript error occured

[ViDom]

Hi,

After I rewrite a control which have inside a bunch of other ext.net controls like in mockup I've provide:

Attachment 4789

I've got javascript error which said me nothing.

SyntaxError: invalid object initializer

I've made this control using this https://examples1.ext.net/#/Combinat.../Simple_Tasks/

here's code of this control:

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Text;
using System.Web;
using Ext.Net;

namespace Sample
{
    public partial class LinkedListFormExt : BorderLayout
    {
        private Ext.Net.Panel northPanel;
        private Ext.Net.Panel centerPanel;
        private Ext.Net.GridPanel gridPanelMain;
        private Ext.Net.Store store;
        private Ext.Net.PagingToolbar pagingToolbar;

        private Ext.Net.Hidden fieldGridDataPrnExp;
        private Ext.Net.Hidden fieldSelectedIds;

        #region buttons

        private Ext.Net.Button btnCreate;
        private Ext.Net.Button btnDelete;
        private Ext.Net.Button btnReload;

        #endregion

        public void Configure()
        {
            ConfigurePanels(ConfigureButtons());
        }

        private List<Ext.Net.Button> ConfigureButtons()
        {
            btnCreate = new Ext.Net.Button { ID = "btnCreateLinked" + this.ID, Icon = Icon.Add };
            btnCreate.DirectClick+=new ComponentDirectEvent.DirectEventHandler(btnCreate_DirectClick);
            btnDelete = new Ext.Net.Button { ID = "btnDeleteLinked" + this.ID, Icon = Icon.Delete };
            btnDelete.DirectClick += new ComponentDirectEvent.DirectEventHandler(btnDelete_DirectClick);
            btnReload = new Ext.Net.Button { ID = "btnReloadLinked" + this.ID, Icon = Icon.Reload };
            btnReload.Listeners.Click.Handler = "#{gridPanelMain"+this.ID+"}.store.reload();";
            return new List<Button>{btnCreate,btnDelete,btnReload};
        }


        private void ConfigurePanels(List<Ext.Net.Button> buttons)
        {
            fieldGridDataPrnExp = new Ext.Net.Hidden { ID = "fieldGridDataPrnExp" + this.ID };
            fieldSelectedIds = new Ext.Net.Hidden { ID = "fieldSelectedIds" + this.ID };
            northPanel = new Ext.Net.Panel { ID = "northPanelLinked"+this.ID, Height = 70, Header = false, Split = true, Collapsible = false };
            northPanel.Items.AddRange(buttons);
            northPanel.Items.Add(new Hidden { ID = "scrollStore" + this.ID });
            this.North.Items.Add(northPanel);

            gridPanelMain = new Ext.Net.GridPanel { ID = "gridPanelMain" + this.ID, SelectionMemory = SelectionMemoryMode.Enabled, AnchorHorizontal = "100%", Cls = "grid-sample" };
            store = new Ext.Net.Store { ID = "storeMain" + this.ID, RemoteSort = true };
            store.AutoLoadParams.AddRange(
                new List<Parameter>
                    {
                        new Parameter{Name="start", Value="0" ,Mode=ParameterMode.Raw},
                        new Parameter{Name="limit", Value="50" ,Mode=ParameterMode.Raw},
                        new Parameter{Name="sort", Value=""},
                        new Parameter{Name="dir", Value=""}
                    });
            store.SortInfo.Field = "Id";
            store.SortInfo.Direction = SortDirection.DESC;
            pagingToolbar = new PagingToolbar { ID = "pagingToolbar" + this.ID, PageSize = 50, DisplayInfo = true, DisplayMsg = "Rows {0} - {1} of {2}", EmptyMsg = "empty" };
            //SlidingPager slidingPager = new SlidingPager();
            //pagingToolbar.Plugins.Add(slidingPager);
            gridPanelMain.Store.Add(store);
            gridPanelMain.BottomBar.Add(pagingToolbar);
            gridPanelMain.DirectEvents.RowDblClick.Before = "#{scrollStore"+this.ID+"}.setValue(this.view.scroller.dom.scrollTop);";
            gridPanelMain.DirectEvents.RowDblClick.Event += new ComponentDirectEvent.DirectEventHandler(RowDblClick_Event);
            gridPanelMain.DirectEvents.RowDblClick.ExtraParams.Add(new Parameter{Name = "grow",Value = "this.store.getAt(rowIndex).data['Id']",Mode = ParameterMode.Raw});
            gridPanelMain.DirectEvents.RowDblClick.EventMask.ShowMask = true;
            gridPanelMain.DirectEvents.RowDblClick.EventMask.Msg = "Please wait...";
            Ext.Net.GridView gridView = new Ext.Net.GridView { ID = "gridView" + this.ID, StandardHeaderRow = true };
            gridView.GetRowClass.Handler = "if (record.data.CssClass != '') return record.data.CssClass;";
            gridView.Listeners.Refresh.Handler="restoreScroll(this, #{scrollStore"+this.ID+"});";
            gridView.Listeners.Refresh.Delay = 10;
            gridView.Listeners.Refresh.Single = true;
            gridPanelMain.View.Add(gridView);
            //ConfigureGridPanelMain();
            centerPanel = new Ext.Net.Panel { ID = "centerPanelLinked" + this.ID, Header = false, AnchorHorizontal = "100%", Collapsible = false, Split = true, Layout = "Fit" };
            centerPanel.Items.Add(gridPanelMain);
            this.Center.Items.Add(centerPanel);
        }

        protected void RowDblClick_Event(object sender, DirectEventArgs e)
        {

        }
        protected void btnCreate_DirectClick(object sender, DirectEventArgs e)
        {
            
        }

        protected void btnDelete_DirectClick(object sender, DirectEventArgs e)
        {
        }
    }
}

Any ideas what could cause this error of javascript?

I've figured it out it was error on tabPanel in which my control was seeded.

Thanks,
ViDom

[Daniil]

Hi,

Please demonstrate how do you use this control?

[ViDom]

Hi,

Please demonstrate how do you use this control?

I've simply write:

LinkedListFormExt linkedListFormExt = new LinkedListFormExt();
//here load some needed properties
linkedListFormExt.Configure();
//and add this loaded correctly control to the some container for example Panel
Ext.Net.Panel panel = new Ext.Net.Panel();
panel.Items.Add(linkedListFormExt);//linkedListFormExt inherit from BorderLayout so i assumed that behavior of my control is same that rest of Ext.Net controls

Am I using it properly?

Edit:
I got a problem with that control after I create buttons and attach to them directEvent. And then click on for example btnCreate I've got exception:

The control with ID 'ctl00_siteContent_category_detail_1_LinkedListControlbtnCreateLinked' not found

in the page source this control is present.

[Daniil]

I've simply write:

LinkedListFormExt linkedListFormExt = new LinkedListFormExt();
//here load some needed properties
linkedListFormExt.Configure();
//and add this loaded correctly control to the some container for example Panel
Ext.Net.Panel panel = new Ext.Net.Panel();
panel.Items.Add(linkedListFormExt);//linkedListFormExt inherit from BorderLayout so i assumed that behavior of my control is same that rest of Ext.Net controls

Am I using it properly?

Yes, you are using it correctly. I just tested, it works well for me. I just needed to remove this line:

gridView.Listeners.Refresh.Handler="restoreScroll(this, #{scrollStore"+this.ID+"});";

because I don't have the restoreScroll function.

So, I can't reproduce this error:

I've got javascript error which said me nothing.

SyntaxError: invalid object initializer

Could you provide a full example to reproduce this error?

Edit:
I got a problem with that control after I create buttons and attach to them directEvent. And then click on for example btnCreate I've got exception:

The control with ID  'ctl00_siteContent_category_detail_1_LinkedListControlbtnCreateLinked'  not found

in the page source this control is present.

I am unable to reproduce it as well. I guess you create it during a DirectEvent, but doesn't recreate during another. Neither ASP.NET or ASP.NET recreates dynamically created controls automatically. But a DirectEvent handler requires a control instance of server side.

So, please recreate required controls or use DirectMethods on the page.

Here is the related thread.
http://forums.ext.net/showthread.php...ll=1#post60155