Code block on ASPX frontend?

Hello all,

I am new in using EXT.NET and try to use the features of this, however, I would like to know if there is something like code block for C# ASPX on the front end depending on the logon session variables, say for example

Code:

<% if (this.Session["UserID"]!="") %> <ext:Button runat="server" Text="Logon" Cls="my-scale" OverCls="x-over" PressedCls="x-button-pressed" IconUrl="Icons/logon.png"> <% else %> <ext:Label runat="server" Text="<%=this.Session["UserID"]%>">

I need some logic that will dynamic change after user logon, and also some code block depending on the database value, some control tag maybe hidden if there is no such values. Also, after one of dropdown list value then will hidden some text box or one of the gridpanel columns ... etc

I know that it maybe not simply like if then else, but could you give me some examples or there are some alternatives to achive this kind of requirements?

Hello @josephmkchan, and welcome to Ext.NET Forums!

I believe you may want use user controls and conditionally add them to the page from code behind. Here's a comprehensive list of examples using it:

- Associations > HasMany > Lazy_Load
- Calendar > Overview > Basic
- Calendar > Overview > Shared
- Chart > Area > Basic
- Chart > Combination > Infographic
- Combination_Samples > Applications > Feed_Viewer
- Combination_Samples > Applications > Feed_Viewer
- Combination_Samples > Applications > Feed_Viewer
- Combination_Samples > Applications > Feed_Viewer
- DataView > Advanced > Chooser
- DataView > Advanced > Chooser
- Desktop > Introduction > Overview
- DragDrop > Basic > Dom
- Events > DirectMethods > ID_Mode
- Events > DirectMethods > ID_Mode
- Events > DirectMethods > Overview
- Events > DirectMethods > UserControls
- Form > Miscellaneous > Contact_Form
- Form > Miscellaneous > Registration_Form
- GridPanel > Infinite_Scrolling > Tuner
- GridPanel > Miscellaneous > Details_Window
- GridPanel > Miscellaneous > Details_Window_Remote
- Layout > FormLayout > With_UserControls
- Loaders > Component > Direct_Method
- MessageBus > Basic > Complex
- Miscellaneous > Bin_HtmlBin > UserControl
- Miscellaneous > Factory > Basic
- Miscellaneous > Template_Widget > Rendering
- TabPanel > Basic > TabBar_Config
- XRender > UserControl > Lazy_Load
- XRender > UserControl > UpdateContent

But you may also be insterested instead in just controlling components' hidden and shown status from code behind. This may be interesting in your case, as you show how a page should behave depending on user logged in or out state, and taking advantage of these features, you can "remodel" the page between states without a full page reload, which should improve a lot the user experience. Here's a little example fiddling with components states and changing their contenta as well as visible status. You can change the initial value indicating user logon (that's just a mock example, you should use robust logic to determine the logon state, of course).

Code:

<%@ Page Language="C#" %> <!DOCTYPE html> <script runat="server"> public static bool UserIsLogged = true; public void Page_Load(object sender, EventArgs e) { if (!X.IsAjaxRequest) { if (UserIsLogged) { this.LoggedButton.Text = "Log out (from page load)"; this.ProfileButton.Disabled = false; } else { this.LoggedButton.Text = "Log in (from page load)"; this.ProfileButton.Disabled = true; } } } public void ToggleLogon(object sender, DirectEventArgs e) { UserIsLogged = !UserIsLogged; if (UserIsLogged) { this.LoggedLabel.Show(); this.NewBtnButton.Show(); this.ProfileButton.Enable(); this.LoggedButton.Text = "Log out"; } else { this.LoggedLabel.Hide(); this.NewBtnButton.Hide(); this.ProfileButton.Disable(); this.LoggedButton.Text = "Log in"; } } private static int NewButtonCount = 0; public void MakeNewButton(object sender, DirectEventArgs e) { var button = new Ext.Net.Button() { Text = "My new button " + NewButtonCount++, OnClientClick = "Ext.toast('new button clicked')" }; button.AddTo(this.Form1); } </script> <html> <head runat="server"> <title>Ext.NET Example</title> </head> <body> <ext:ResourceManager runat="server" /> <form id="Form1" runat="server"> <ext:Button runat="server" Text="More Info" OnClientClick="Ext.toast('More information.');" /> <ext:Label runat="server" ID="LoggedLabel" Text="User is now logged in." Hidden="<%# !UserIsLogged %>" /> <ext:Button runat="server" ID="ProfileButton" Text="View Profile" OnClientClick="Ext.toast('User profile.');" /> <ext:Button runat="server" ID="LoggedButton" OnDirectClick="ToggleLogon" /> <ext:Button runat="server" ID="NewBtnButton" Text="Add another button." OnDirectClick="MakeNewButton" Hidden="<%# !UserIsLogged %>" /> </form> </body> </html>

And, of course a mix-up of this and user controls can be made. You can also fully attain dynamic components rendering on load, instead of XML block-oriented, by adding the components from code behind (instead of setting their hidden/shown state).

The problem about the if/else block approach is that the components get instanced to ASP.NET but due to the conditionals, are not always available, thus this breaks Ext.NET's resource managing internals. I am also a bit intrigued, that I have even searched the forums and didn't find any discussion on this subject throughout the 12 years of Ext.NET forums.

Some other keywords you may be insterested in, aside of code behind and user controls mentioned so far would be, perhaps, server controls, master pages, asp:PlaceHolder and Ext.NET's loader.

Hope this helps!

Hi Fabricio,

Thank you very much! Let me try your advised approaches.