How to create regions in an aspx file? - asp.net

I wonder is there any way we can create regions in aspx page as we create it in our cs pages.

not as Expandable, but in HTML it is normal to use the comments in order to create blocks of code
<!-- Start: Login access form -->
... Code ...
<!-- End: Login access form -->

Unfortunately no (at least not in Visual Studio).

You can select the commented section, then right click, collapse tag.

I don't think there's a way to do this.
However, I would suggest that if you are feeling the need to do this because your .aspx pages are very large, you might should look at redesigning it, or breaking it apart into User Controls (.ascx) or figure out a more effective use of master pages.
Not sure if that's the reason behind your question, but if it is, it's just a thought to pass on.

If you're using Visual Studio (could be the web essentials plugin, I can't remember if its native), the following snippet will be expandable in HTML files (including CSHTML). Unfortunately, these are not expandable in ASPX or ASCX files.
<!--#region Example -->
...code...
<!--#endregion Example -->
In an ASPX or ASCX file, perhaps you'd rather want to go with this:
<%-- START Example --%>
...code...
<%-- END Example --%>
They're still not expandable, but those will not get rendered out and therefore not be visible when right clicking on the page and viewing Source Code. You'll only see them in the development file.
P.S.
I didn't realize how old this question was until I finished typing out my answer. So I'm just going to go ahead and put this here anyway since it looks like it could use an update.

Visual Studio does a pretty good job of identifying elements with a significant amount of content to make it collapsable dynamically but thats the closest you going to get.
It might occur to you to place a series of element sibling in a DIV so that the div can be collapsed in visual studio. Thats very tempting but I would advise against it.

Regions are an IDE convenience that allow you to name a segment of code that may span multiple functions or procedures and be able to collapse/expand the whole segment as a whole. Visual Studio provides this feature only for code and not for HTML/ASPX/CSS portions of a file. For instance, you can create Regions within the <script runat="server"> section of an ASPX file.

You could use a div and put everything inside it

Related

Ways to keep the same header on every page of the website

I am trying to make a member based website in which I will need to keep the HEADER and certain other elements fixed on every page of the site.
I am familiar with the concept of MasterPages in Asp.net, and SHTML however I find it a bit confusing and tedious to use them for a website.
I want to know that are their some other ways to achieve the same feat in a way other than SHTML or MasterPages, one that is more refined and easy to implement?
Create User Control In your Application and Register Your User Control in your Page(like .aspx).
<%# Register TagPrefix="UC" Src="~/UserControl.ascx" TagName="mycontrol" %>
and Use Like control.
<UC:mycontrol ID="my" runat="server" />
You need to get acquainted with the concept of UserControls. Read here for a complete understanding: MSDN LINK
User controls are powerful functionality of ASP.NET. With the help of the user control you can reuse the Design as well as code in the application.
This another link provides very basic introduction of UserControls and finally ends up creating a one:http://asp.net-tutorials.com/user-controls/introduction/
I am currently using a perl script that concatenates header/content/footer files together. However this is a bit OTT so I am in the process of converting to iframes. All you need do is add a line to the top of each page...
<iframe border=0 src="http://mysite.com/header.html"></iframe>
You can adjust the size of the frame if needed.
If you don't like master pages, you could always try Dreamweaver templates, which auto generates the template contents on each page using the templates.

How to make a custom version of AjaxControlToolkit.TabContainer

I guess this is a lot of questions bundled into one post.
I want to build a wizard-like control which looks similar to the TabContainer
But I need certain customizations. These would be like I'd want to associate some help text with the TabPanel. So I imagine I'd want to write my markup like below for the tabpanel:
<cc1:MyTabPanel ID="mtp1" runat="server">
<HelpTextTemplate>
This is your step 1 which is about ...
</HelpTextTemplate>
<ContentTemplate>
Content goes here...
</ContentTemplate>
</cc1:MyTabPanel>
So what do you do to make markup like that...? And how would our control from code behind be able to access data between HelpTextTemplate - which may contain server controls and all?
Moreover, notice that there is a button called 'Save' in the above pic. The user simply drags and drops into the tab panel. And when the user double-clicks on it we have a method stub generated in the code behind (which belongs to the aspx page). How is all of this achieved?
And to cap the whole solution off, I realize we have to wire some javascript to simulate that tab functionality. There is css here too (Notice the images behind the tabs - the gradient, etc). The aspect that I am looking at is making this into a control that the users can use out-of-box just like the toolkit's tabcontainer control. Hence the css/javascript should kind of be bundled. How to achieve this?
Edit:
I am also interested in making the control designer (design-time interaction) part. I am looking for functionality the same way we have for the asp.net wizard control. I have found answers to some of the questions I had above will add it when I find time.
For embedding a script or image to the asp.net custom control I found a solution mentioned in the below site:
Embed js resource with custom asp.net control
What I suggest here it may sound too much, but I can not think other easy way for what you ask and the way you won it.
Grab the source code of the TabContainer, clone it, and make all your custom settings base on that source code. The first steps is to get the full source code of this asp.net toolkit and make a build that working. The second step is to add a clone of the TabControl, with new names. Then you work on this clone to make your changes as you wish for. The final step is to try to separate your custom control in a stand alone library if this is possible.
Download the latest version of the full asp.net ajax control toolkit
http://ajaxcontroltoolkit.codeplex.com/SourceControl/list/changesets
Here you can see online the source code for the TabContainer only
http://ajaxcontroltoolkit.codeplex.com/SourceControl/changeset/view/2c482e5ad6c4#Server%2fAjaxControlToolkit%2fTabs%2fTabContainer.cs
The control you are trying to build is not incredibly complex, but it does involve a number of different techniques.
I would suggest creating your own control from scratch rather then inheritting an existing one. Probably using CompositeControl as the base would be best since it gives you a lot of flexibility.
For HelpTextTemplate/ContentTemplate you'll want to create some ITemplate containers, take a look at this article http://msdn.microsoft.com/en-us/library/aa478964.aspx on how to set these up. Since you may want to access the contents/controls in HelpTextTemplate take a look at this article for how to access them: ASP.Net ITemplate - ways of declaring.
For the tabs, since this is custom, I would probably avoid AjaxControlToolkit. Instead I would include a reference to jQuery UI and use jQuery UI Tabs: http://jqueryui.com/demos/tabs/. Your CompositeControl just needs to output some divs, ul/li elements and you'll be good to go for making the tabs.
If you are fixated on using the AJAX Control Toolkit Tabs then you still can. You'll need to instantiate an instance in your custom control, add it to the control tree, and then use a technique like this: http://msdn.microsoft.com/en-us/library/0e39s2ck.aspx to transfer the contents of your template to the tab pages.
Being able to drag and drop a control from the toolbox onto your page is simple; if your server control library is already part of the same solution as your website then it will just show up. Worst case scenario you can use the Add Items option and add the DLL by browsing for it. As for how the Click event is created when you double click a button, that is done through an attribute on the class, take a look at this tutorial on setting up default events: http://msdn.microsoft.com/en-us/library/43sxkdeb.
As for embedding javascript into the library, these two questions cover how to do this specifically for jQuery UI, if you choose to go some other route it should still be pertinent: How to embed jquery library in asp.net custom server control?, http://forums.asp.net/t/1599621.aspx/1.
As for design time support, try reviwing Microsofts article on this (includes a sample): http://msdn.microsoft.com/en-us/library/aa478960.aspx or this CodeProject article on it: http://www.codeproject.com/Articles/9227/ASP-NET-Server-Control-Design-Time-Support.

Strange Problem with asp.net website

I've built an asp website and i have the following issues:-
i'm using a master page in it and have defined two contentplaceholders one in head one in content, and i've specified the page title in the top most directive at the #page directive but the page title doesn't show up. I have to manually add a tag for it.
Secondly when i create a content page from a master page it creates it and when i rename it, it doesn't rename it's class. It remains _Default, thus every page was having an inherit to _default.
Most importantly
I'm using a page to enter and view data to the database. I've used a boolean called isadmin which i set according to credentials at page load. and i'm added a panel where it's visible property is set to Visible = '<%#IsAdmin %>'. It works properly when i run it through the visual studio environment but when i publish it and run it doesn't work and the panel just comes and stays there. Why is it happening? Any idea?
Thanks
The Visible problem is fixed as i had to enable windows authentication on the server. Awaiting answers for the other two issues. Thanks
Try to add a <head runat=server> to the master page. Only then ASP.net can "see" the tag and modify it
It is not that bad that several aspx-pages have identical class names. ASP.NET 2.0 started to process every page as its own compiling unit or so. Pages cannot see each other. There is a special directive to make pages see each other and instanciate or manipulate them. So it should not do much harm
Maybe you did not test this correctly and are mistaken that it DOES work in Visual Studio??? But in any case I would suggest that you move your logic into OnInit, then it runs much earlier. I think the control tree is build before Page.OnLoad. What you do is data binding, that might run only if DataBind is called, I'm not sure
Or use the safe way: Make IsAdmin a property so that it initializes itself on first call and caches the result in a variable
Regarding question #2 - add your content pages via Project -> Add New Item, and name it appropriately there. That way the naming is consistent and correct throughout.
Regarding #3, what HTML is output when you run it from the server?
your first issue can be solved by filling out the title part of the #Page directive in your .aspx pages. The master page will display that text in the browsers title bar.
and prob #2 should be solved by adding the files using the file add option in visual studio.

Multiple localized aspx layouts

I want to localize an application, and currently use the App_LocalResource resx files for language changes. However, I want to change the layout of the controls on an ASPX page dependant on locale. I know it is possible to set visible from the resx file.
For example; my default (en-US) could have
"firstname" : [textbox]
"surname" : [textbox]
where as de-DE I would want to swop the order
"surname" : [textbox]
"firstname" : [textbox]
The aspx pages will use the same CodeBehind.
I guess what Im looking for is something along the lines of having;
default.aspx
default.de-DE.aspx
default.aspx.cs
Where the default.de-DE.aspx contains all the same controls etc as default.aspx and even has the same directive;
<%# Page CodeFile="Default.aspx.cs" Inherits="MyNamespace.Default" %>
Then the .NET framework picks up this one rather than default.aspx layout..
I have worked for quite some time on a project that does essentially what you are looking to do; We split it by folder is the only difference, so /en-US/Default.aspx and /de-DE/Default.aspx. The pages share a common code-behind for functionality. It works pretty well, with a few gotchas:
Making sure the files are always updated together - This is necessary because of the shared code behind. If you update the code behind, all the referenced controls had better exist on the pages.
Be careful about your control references - we've run into some issues where controls were referenced from the wrong folder, resulting in some interesting (and sometimes hard to diagnose) issues.
Personally I would recommend splitting it into folders instead of using the file naming structure because it also very easily allows you to provide locale specific images and CSS . Also it allows you to override the common behavior of a page by just adding the appropriate code behind (you could do this too, but then your class names will be strange due to the periods in the file names[eg. ApplicationNS.Default_de_de as opposed to ApplicationNS.en_us.Default]).
In a similar situation I've created a custom server control with a localizable "RenderOrder" property. It also exposes Surname and FirstName as properties.
A similar scenario sometimes is required for detailed address fields too.
I would say the best way to handle this would be via CSS.
You can easily apply a different stylesheet, which can completely change the layout of your website, and thereby move all the controls around. This solution also allows you to easily do alternate renderings for mobile browsers, or printing, or any other reason and is very versatile.
As other s stated, you will obviously have other localization issuse such as translation or date/currency formats as well. But you will have to solve those via other means.
Here are some examples of the same website, with 100% the same HTML, where only the CSS has changed, rendering completely differently.
http://www.csszengarden.com/?cssfile=/212/212.css&page=0
http://www.csszengarden.com/?cssfile=/211/211.css&page=0
Assuming your simple case where you have just two controls that you want to flip :
<div>
<div class=class1>Control1</div>
<div class=class2>Control2</div>
</div>
Then based on the location, in your stylesheet use either floats, or absolute positioning (within the parent container) to reposition the two divs. 100% identical html, with two different layouts?
ASPX
<link rel="stylesheet" id="Stylesheet1" type="text/css" runat="server" />
ASPX.cs
Stylesheet1.Attributes("href") = ResolveUrl("~\styles\StyleSheet.css")
I should vote for building a control that's the way you display dates and times which is heavily dependent on localization
Resources and Localization in ASP.NET 2.0
Custom ASP.NET Server Controls and Language Localization
Good general article on localization

How do I remove fields from a web form using ASP?

I have a web page that has a web form for signing up. I want to remove fields. I've tried removing the field code from the .asp file but obviously there are other things that I need to remove along those lines. I have full access to all the code but I need help knowing where things are linked as far as making the form work again. Our programmer bailed.
A step by step guide would be great on this. thanks.
If they're just .ASP files, you should be fine removing the field tag, along with any references to it.
I.e. you'd delete this line:
<asp:TextBox id="text1" runat="server" />
and do a search for the 'id' attribute in the rest of the file (a find on 'text1' in this case), and remove those lines.
If everything to do with that for in in the same ASP page, it's easy. You can do a simple text search for the names and/or IDs of each form field. Sometimes they're referenced in a javascript block, so you'll have to comment-out some of the form validation code referencing those fields.
If they've used some dumb Dreamweaver script for all this - good luck!
If there are #include statements, or references to external JavaScript files it's more work - you'll have to trace through them as well, hoping they don't have their own included files as well.
After removing the input parts of the markup, if it is a .asp (assuming asp v3 instead of asp.net) it is also worth going through the <% %> tags part of the page to look for references to the removed inputs. If it's asp.net then check the vb.net / c# code in the script runat server block in the page, or look in the code behind file for references and recompile.

Resources