Validating Master Page UserControl

8/10/2019 Validating Master Page UserControl

1/36

Validation Controls, UserControls,

Master Pages
http://www.apextgi.in/


2/36

Server ControlsValidation Controls

A validation control(or validator)determines whetherthe data in another web control is in the proper format,

before the data is processed. When the XHTM for o!r pa"e is created, the validator is

converted into JavaScriptthat performs the validation. #avaScript is a scriptin" lan"!a"e that enhances the

f!nctionalit$ and appearance of web pa"es and is t$picall$

e%ec!ted on the client. &eca!se some clients disable or do not s!pport scriptin",

AS'.)T validation controls can f!nction on the client,on the server or both.


3/36


*ich, declarative validation Validation declared separatel$ from inp!t control )%tensible validation framewor+ S!pports validation on client and server Serverside validation is alwa$s done

'revents !sers from spoofin" Web -orms


4/36


)ns!res that a val!e is entered

Chec+s if val!e is within minim!m and ma%im!m val!es

Compares val!e a"ainst constant, another control or data

t$pe

Tests if val!e matches a predefined pattern

ets $o! create c!stom client or serverside validationf!nction

ispla$s list of validation errors in one place


5/36


Validation controls are derived from

System.Web.UI.WebControls.aseValidator , which is

derived from the !abelcontrol Validation controls contain te%t which is displa$ed onl$ if

validation fails "extpropert$ is displa$ed at control location Error#essageis displa$ed in s!mmar$


6/36


Validation controls are associated with their tar"etcontrol !sin" the Control"oValidatepropert$

Can create m!ltiple validation controls with the sametar"et control

asp:"ext ox$id%"ext ox&$runat%ser'er$(>

asp:RequiredFieldValidator$id%)Req&)$$$$$$$$$

$$Control"oValidate%)"ext ox&)$$$$$$$$$$$$

$$"ext%)Required$Field)$runat%ser'er$(>


7/36


*age.IsValidindicates if all validation controls onthe pa"e s!cceed

'oid$Submit+,li,-ob/e,t$s0$E'ent1rgs$e2$3

$$i4$*age.IsValid2$3

$$$$#essage."ext$%$)*age$is$'alid5)6

$$7

7


8/36


8isplaypropert$ controls la$o!t Stati,/ fi%ed la$o!t, displa$ won0t chan"e if invalid 8ynami,/ d$namic la$o!t 9one/ no displa$1 can still !se ValidationSummary

and *age.IsValid "ypepropert$ specifies e%pected data t$pe/Curren,y, 8ate, 8ouble, Integer, String


9/36


Can force downlevel option 2nl$ serverside validation

http/33msdn.microsoft.com3en!s3ma"a4ine3bb56789:.asp%

$;$*age$!anguage%),


10/36


emo/ValidationControls;.asp% emonstrates each t$pe of validation control


11/36


The codebehind file validates the informationa"ain in case the client has #avaScript

disabled.

The s!bmission of a form sends its data to theserver and ca!ses the c!rrent pa"e to be

re


12/36


=se the IsValidpropert$ of class *agetochec+ whether all the validators s!cceeded.

>o! sho!ld alwa$s call method Validate

before !sin" propert$ IsValid. When data is posted to the web server, the

form0s data becomes accessible to the web

application thro!"h the properties of thevario!s web controls.


13/36


Examining the Client-Side XHTML for a Web Formwith Validation

?f a validation control0s

EnableClientS,riptpropert$ is "rue, the

validator performs clientside validation as the!ser edits the Web -orm.

>o! do not need to be able to create or even

!nderstand the #avaScript validation code@

the validators are converted to wor+in"

#avaScript b$ AS'.)T.

The EnableVie=Stateattrib!te

determines whether a web control0s c!rrent state


14/36


The defa!lt val!e, "rue, indicates that the control0sstate at the last postbac+ is retained.

A iddeninp!t called ++VIEWS"1"Estores the

controls0 data as an encoded strin" so the server candetermine whether it has chan"ed.

Performance Tip

SettingEnableVie=State

toFalse

reduces the amount of datapassed to the web server with each request.


15/36

Validation Controls )%ercise


16/36



17/36



18/36



19/36

Master 'a"esCreating a Master Page

The master pa"e defines the elements we want to appear on eachpa"e. A master pa"e is li+e a base class in a vis!al inheritance

hierarch$.

The master pa"e contains placeholders for c!stom content

created in each content pa"e.

To create a master pa"e, ri"ht clic+ the location of the website inthe SolutionExplorerand select AddNewItem.

Select MasterPageand specif$ &!"B&!".master as the file

name.

Master pa"es have the filename e%tension .masterand, li+e Web-orms, can optionall$ !se a codebehind file to define additional

f!nctionalit$.

eave the bo% labeled Place code in a separate ile!nchec+ed

and clic+ Addto create the pa"e.


20/36

Master 'a"es The mar+!p for a master pa"e is almost identical to that

of a Web -orm. A master pa"e contains a

#aster

directive, which

specifies that this file defines a master pa"e !sin" the

indicated !anguagefor an$ code. Code that wo!ld !s!all$ be placed in a codebehind file

can be placed in as,ript

element. e%t, set the titleof the pa"e to ug?ug. The master pa"e contains two Content*la,e@older

controls for content that will be defined b$ a content pa"e.


21/36

Master 'a"es At this point, $o! can edit the master pa"e in

!esignmode as if it were an AS'X file. The Content*la,e@oldercontrol appears as a

rectan"le with a p!rple o!tline indicatin" the control0s

t$pe and ?.

=sin" the Propertieswindow, chan"e the ? of thiscontrol to bodyContent.


22/36

Master 'a"es 'lace the c!rsor to the left of Content*la,e@olderand select

"able # Insert "able.

?n the Insert "abledialo", set $owsto B and %olumnsto ;. ?n the&a'outsection, specif$ a %ell paddingand a %ell spacingof 8.

Set both the width and hei"ht of the table to ;88 percent. Ma+e s!re

that the Si(eval!e in the orderssection is 8.

Clic+ OKto create a table that fills the pa"e and contains two rows. Chan"e the st$le to have 'erti,alAalignpropert$ of the bottom

table cell to topand dra" the Content*la,e@olderinto this cell. Set the @eigtof the top table cell to &B. Add an Imagecontrol

named eaderImagewith its ImageUrlpropert$ set to the

bug?bug.pngfile.


23/36

ug?ug.masterpa"e that defines a lo"oima"e header for all pa"es


24/36

Master 'a"esCreating a Content Page

*i"ht clic+ the master pa"e in the Solution Explorerandselect Add %ontent Page. *ename the efa!lt.asp% to

Content'a"e.asp%, then open it in Sourcemode

The *agedirective indicates the #aster*ageFilethat is !sed asa startin" point for this new pa"es desi"n.

The"itle

propert$ specifies the title that will be displa$ed in theweb browsers title bar when the content pa"e is loaded.

This val!e, which we set to Createa9e=User, replaces theval!e (i.e., ug?ug set in the titleelement of the master pa"e.

&eca!se Create9e=User.aspxspecifies ug?ug.masteras

the pa"es #aster*ageFile, it implicitl$ contains the contents ofthe master pa"e.


25/36

Master 'a"es The content pa"e contains Contentcontrols, in which we

will place pa"especific content that will replace the master

pa"es Content*la,e@olders. The Content*la,e@olderI8propert$ of the Content

control identifies which Content*la,e@olderthe controlsho!ld replace

The relationship between a content pa"e and its master pa"eis more evident in Designmode/

M t '


26/36

Master 'a"esdding a Cre teU erWiD rd Control to a Content Page

Create9e=User.aspxis the pa"e in o!r website that allows

firsttime visitors to create !ser acco!nts.

To provide this f!nctionalit$, we !se a %reate*ser+i(ard

control.

'lace the c!rsor inside the Content control in !esign mode and

do!ble clic+ Create=serWi4ard in the "oolboxto add it to the pa"e.2pen the %reate*ser+i(ard "askssmartta" men! and clic+ Auto

,ormat. Select the Proessionalcolor scheme.

When the !ser clic+s the %reate *serb!tton, AS'.)T verifies that

all the form0s re

acco!nt. (we will !se this ne%t wee+?n Create9e=User.aspx, the *agedirective indicates that thiscontent pa"e inherits content from ug?ug.master.


27/36

Creatin" Controls AS'.)T provides two wa$s to create $o!r

own serverside controls =ser Controls/ )ssentiall$ a mini .asp% file C!stom Controls/ >o! derive a class from

System.Web.UI.Control


28/36

Creatin" Controls=ser Controls

=ser controls simplif$ the re!se of code and =?components within a Web application A !ser control is a !serdefined Web server control with an

.asc% e%tension Contains HTM, b!t not the DHTME, D&2>E, or

D-2*ME ta"s )nables f!ll encaps!lation

S!pports nested controls

Separate code namespace

Separate code lan"!a"e

Can partition wor+ across m!ltiple developers Freat wa$ to re!se wor+ across m!ltiple pa"es and

applications


29/36

Why Use User Controls?

Reuse user interface and code

Page2.aspx

Control1.ascx

Page1.aspx

Page3.aspx

Application A Application B

Addi = C t l


30/36

Addin" a =ser Control

*e"isters !ser control for !se on a pa"e

=se the G *e"ister directive to incl!de a !sercontrol in an AS'.)T 'a"e

?nsert the !ser control in a Web -orm

=se Fet and Set properties of the !ser control

nu('p&u = )* //uses Set

$ = nu('p&u* //uses +et

nu('p&u = )* //uses Set

$ = nu('p&u* //uses +et

) ample =ser Control


31/36

)%ample =ser Control Create &efore=serControl.asp%

Add B "extboxcontrols with RequiredFieldValidatorandRangeValidator Add a uttonthat adds the val!es in these te%tbo%es and

displa$s the s!m in a !abel

Create a +eb *ser %ontrol numberbox.ascx

Add a "extboxcontrols with RequiredFieldValidatorandRangeValidator

Create After=serControl.asp% *e"ister the !ser control n!mberbo%.asc%

Add B numberbox controls

Add a uttonthat adds the p9umproperties in thesenumberboxesand displa$s the s!m in a !abel


32/36

Creatin" Controls'ro"rammatic =se of =ser Controls

*age.!oadControlstring sour,e2 $namicall$ instantiates a !ser control

Create an instance/Control numbox& % *age.!oadControl)numberbox.as,x)26

?nsert into the control hierarch$/my*anel.Controls.1dd4oo26

Create$namic=serControls.asp%


33/36

Creatin" ControlsC!stom Controls

A class that $o! create erived from System.Web.UI.Control

http/33msdn.microsoft.com3en!s3librar$34tB9tfh$.asp%

using Syste*

using Syste',eb*using Syste',eb'U-*

public class My.ontrol : .ontrol

protected override void !ender01M2e$t,riter 34

3',rite05.ontrol output74*

88

i l


34/36

Creatin" ControlsC!stom Controls

M!st implement Render2method Can e%pose properties, methods and events Sho!ld maintain state Sho!ld handle postbac+ data

Can "enerate clientside script to do postbac+

Sho!ld handle child controls *ender them

Handle events

Can e%pose and implement templates Can handle data bindin"

C i C l


35/36

Creatin" ControlsC!stom Controls vs. =ser Controls

*ser %ontrols %ustom %ontrols

Good for application-specific UIGood for reuse,encapsulate common UI

Easy to build Can be more complex to build

ess flexibility, performance,designer support

!otal flexibility, better performance,and designer support

"o template support Can support templates


36/36

Documents

Validating Master Page UserControl