controls n.
Skip this Video
Download Presentation

Loading in 2 Seconds...

play fullscreen
1 / 23

Controls - PowerPoint PPT Presentation

  • Uploaded on

Controls. Things like Textboxes, L ables , ‘ n’at. ASPX page is not HTML. Controls are rendered into markup that a browser can understand Some controls are rendered as HTML Some controls are rendered as javascript Some controls don’t render at all. A Simple Control.

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
Download Presentation

PowerPoint Slideshow about 'Controls' - denise

Download Now An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript


Things like Textboxes, Lables, ‘n’at

aspx page is not html
ASPX page is not HTML
  • Controls are rendered into markup that a browser can understand
  • Some controls are rendered as HTML
  • Some controls are rendered as javascript
  • Some controls don’t render at all
a simple control
A Simple Control

<asp:LabelID="Label1"runat="server"Text="Awesome Label"></asp:Label>

  • Important Notes:
    • Runat=“server”
      • Required if you want to be rendered as a server control instead of regular HTML
    • ID=“Label1”
      • Required if you want to access this control from the code-behind


how does it render
How Does it Render?

<spanid="Label1">Awesome Label</span>

  • In this case, the control renders as less code than there was in the ASPX page
    • not the case with all controls
  • Will render differently based on the HTTP context (different browsers, HTTP versions, mobile support, etc.)
name mangling
Name Mangling
  • ASP.NET ID’s are not guaranteed to stay the same when a page is rendered
  • ASP.NET “mangles” the name to make it unique on a page.
name mangling1
Name Mangling
  • If The Page is placed inside a master page [EPIC FORSHADOWING]:

<spanid="ContentPlaceHolder1_Label1">Awesome Label</span>

  • Controls are named with the name of its containing control.
name mangling2
Name Mangling
  • Id’s are different on the client side compared to the server side
    • This is important to know if you are using *any* client side code.
  • Use the Control.ClientID to access this name from the server side
  • <asp:TextBoxID="TextBox1"runat="server"Text="Sample Text"></asp:TextBox>
  • Similar to Label control
  • Can use this control to get input from the user
  • <inputname="ctl00$ContentPlaceHolder1$TextBox1"type="text"value="Sample Text"id="ContentPlaceHolder1_TextBox1"/>
  • Textboxes render as <input>.
  • The “text” field is rendered as “value”


<asp:ListItemText="Option 1"Value="1"></asp:ListItem>

<asp:ListItemText="Option 2"Value="2"></asp:ListItem>




<optionvalue="1">Option 1</option>

<optionvalue="2">Option 2</option>




<asp:ListItemText="Option 1"Value="1"Selected="True">


<asp:ListItemText="Option 2"Value="2"></asp:ListItem>





<td><inputid="ContentPlaceHolder1_CheckBoxList1_0"type="checkbox"name="ctl00$ContentPlaceHolder1$CheckBoxList1$0"checked="checked"value="1"/><labelfor="ContentPlaceHolder1_CheckBoxList1_0">Option 1</label></td>


<td><inputid="ContentPlaceHolder1_CheckBoxList1_1"type="checkbox"name="ctl00$ContentPlaceHolder1$CheckBoxList1$1"value="2"/><labelfor="ContentPlaceHolder1_CheckBoxList1_1">Option 2</label></td>



  • Note this:


  • This lets you click on the name of the checkbox and still “check” the box
  • Many server controls are rendered with tables
    • This makes the display more consistent across browsers*
    • This is so ASP.NET doesn’t have to make assumptions about any CSS styling your page uses
user controls
User Controls
  • Used to group multiple controls and treat them as a single control
  • Can be used more than once on a page, and on multiple pages
a simple user control
A Simple User Control





















using a user control in a page
Using a User Control in a page

<%@Registersrc="SimpleUserControl.ascx"tagname="SimpleUserControl"tagprefix="uc1" %>



master pages
Master Pages
  • Common layout for a group of pages
  • The old way:
    • User control placed at the top of every page
  • The new way:
    • A page inside a page
      • Inside a page
        • Inside a page
          • Inside a page
            • INSIDE YOUR DREAM!
creating a master page
Creating a Master Page

<%@MasterLanguage="C#"AutoEventWireup="true"CodeBehind="Main.master.cs"Inherits="Course_Offerings.App_MasterPages.Main" %>



important notes
Important Notes
  • ContentPlaceHolder
    • This is where child pages are rendered
    • You need at least one of these if you want child content to render
    • If you define a content placeholder, child pages need to use them
using a master page
Using a Master Page

<%@PageTitle=""Language="C#"MasterPageFile="~/App_MasterPages/Main.Master"AutoEventWireup="true"CodeBehind="UserControlExample.aspx.cs"Inherits="Course_Offerings.UserControlExample" %>


<asp:LabelID="Label1"runat="server"Text="Awesome Label“


accessing the master page
Accessing the master page
  • On the Designer page:


  • And in the Code Behind:

stringx = Master.CustomProperty;