Understanding ASPX files - ASP.NET Tutorial

- [Instructor] So, let's get started to look into how ASPX actually works, and I'm going to open up the ASPX page. We've seen that before but we only touched the content part of it, and that it gets replaced inside the site master page. So let's look at the page itself, how does it look like? First of all, we start with something called a page directive, so every single ASPX page will start with a page directive, and there are several ones. One of them is called the page page directive. There is another one called name spaces. There is another one called include and assemblies. But for the sake of brevity, we're only going to talk about page page directive in here. So the first thing we have, we have a property called title, and as you can see this one is set to about. That means that inside my current page I will have a variable called title that will contain the text about. Then I specify the language of this particular page. Then I specify which master page files should I use, so that's where actually the master page comes into place. We have here the site master, so this is the page that we are talking about. Then we have a property called AutoEventWireUp. AutoEventWireUp, it's nothing more than just a way for me to say that there are some events on the page that I want you to automatically try to identify them, and I will show you one in just a minute. So just keep this in mind. In the next part we have the CodeBehind file, which is about.aspx.cs, which means that if I want to connect this page with the CodeBehind file, the information would be in this particular CS file. And then last but not least, we have an Inherits which says from which base called we are inheriting. So, let me show you quickly the CS file, although we are going to talk in detail in the next chapter, and show you that we have here a file called about.aspx.cs, and inside it we have a class called demoapp.about, so that's how those two are connected. Now, what asp.net does whenever it sees an ASPX page, it will automatically generate a C sharp file. I know it might sound a little bit counter intuitive, especially when we see here stuff that looks like HTML, and they would be generated as HTML, but the way it works is that it takes information that it finds in here and it will convert it in C sharp code. So, one of the things, for instance, when it encounters this asp:Content, asp:Content has an interesting attribute called run at server. This run at server attribute, it says to asp.net that please treat that as a non-HTML piece of code and treat it actually as a control that you can work with. And because it has the run at server, now asp.net knows to connect this one with what we saw earlier in the site master file. The next part is this one, it's this h2, for this one it will just say take this h2 and generate code, and actually the code generated would be something along those lines, response.write, and it'll write the text as is. The next thing it will encounter will be this <%:. What that does, it will take the variable title that we set up here actually to the value about and it will say please encode that one, and write it to the output. And then it sees this, which is actually text from here to here and with all of this it will just say again response.write. Now, when we talk about those, there are different other directives that are available for us to use. Another directive would be this one, equal. So equal does the same thing that colon, but it does not do encoding. Encoding means that if I put an HTML tag in this one, it will automatically put it as is. So if I put encoding like this, it will transfer that and it'll just write the text as is. I will show you shortly a demo exactly how that is done. And one more thing that we have, we have a code directive. So if I write something like this, I can write direct C sharp code inside this particular page. And the reason it knows that it's C sharp is because I added here language C sharp. So then I can do something like title equals, and then instead of having the about title, I will override the value with something from code. Okay, and this being a normal C sharp code, I have to put a semicolon, and if I run the application now I will see that on the ASPX page, my title will not be about anymore, it'll be from code. As you can see now we have from code. And just to show you how the difference between encoding and non-encoding, if I put that now to be an equal and I save it and I refresh the page, it will still show me the code. But if I go now and change from code to something along the line, let's do I, so that's in italic like this, and then I save it and then I do a refresh, then from code would be italic. And if I go back here then put again the colon, and I save it, and I refresh the page, then it will show me the text as is, meaning that it will do an HTML encoding. Be aware that if you use HTML directly on the page, you might actually make your site susceptible to script injection, meaning that if I put an HTML that contains the Javascript, then it would automatically be run on the page if that is not encoded.