ZAMBAK_IT_ExpressionWeb2
.pdf
Updating your web site online
A traditional way to update your web site is to change your web site in your local
computer and then upload that page to the web server, but in a dynamic web site it is possible to modify or delete a page or add a new page online.
Open the page each_type.aspx that you want to update online and click the Configure Data Source link.
Do not make any changes and click Next button.
On the next window, select the * sign to select all columns and then click the
Advanced button.
Creating a Dynamic Web Site 141
Check the Generate INSERT, UPDATE, and DELETE statements box and click OK.
Adding Insert,
Update, and
Delete statements
Click the Next button, test the query and finish the wizard.
A warning message to regenerate the FormView is displayed, click Yes.
The FormView is regenerated and the existing template is deleted. Three new buttons Edit, Delete, and New are added.
Click Edit Templates and make the desired changes for the
ItemTemplate.
The following picture shows how the ItemTemplate has been changed.
142Chapter 7
You can also change templates for the Edit and New statements.
Click EditItemTemplate from the Display drop-down menu.
EditItemTemplate is displayed in the FormView.
The Edit Item Template
You can change the properties of each object, for example the sizes of short and long text boxes.
Select the textbox whose size you want to change.
The Edit Item Template after making changes
In the Tag Properties, type values for the Width and Height to change its size and select MultiLine for TextMode to write text on many lines.
Creating a Dynamic Web Site 143
Changing button properties
144Chapter 7
Uploading pictures
You can change all text including the name of the pictures, but you cannot upload pictures to the web server using this template. You can create a page to upload picture files.
Select File>New>ASPX to create a new dynamic page and save the page naming it upload_pic.aspx.
Type a text in the EditItemTemplate, create a hyperlink to the upload page setting the Target Frame to New Window.
Created a
hyperlink
Open the upload page and type a title.
Drag the FileUpload, Button, and Label controls to the page from the ASP.NET Controls>Standard.
Select the Button, type ‘UploadBtn’ for the ID and ‘Upload’ for the Text in the Tag Properties.
Add the following script in the Code view.
<script runat=”server”>
protected void UploadBtn_Click(object sender, EventArgs e)
{
if (FileUpLoad1.HasFile)
{
FileUpLoad1.SaveAs(@”C:\x-life\images\types\” + FileUpLoad1.FileName); Label1.Text = “File Uploaded: “ + FileUpLoad1.FileName ;
}
else
{
Label1.Text = “No File Uploaded.”;
}
}
</script>
The picture file will be uploaded to the ‘C:\x-life\images\types\’ folder. If the file is uploaded, it writes ‘File Uploaded’ and its file name, otherwise ‘No file Uploaded’.
Save and preview the page to check how it is working.
Creating users
You have created the buttons to modify the page, but they are now available for all visitors and any user can change your web site. So you should create some users and modifying buttons must be available only for these users.
Add the following code to the web.config file. It is required for the Login Controls to work.
<system.web>
<roleManager enabled=”true” />
<authentication mode=”Forms” />
</system.web>
Creating a Login Page
Create a new page from the Master page and click the Create Custom Content link.
Drag the Login control to the page from ASP.NET Controls>Login.
The Log In control
The Login page is ready, now save and preview the page, login.aspx.
Creating a New User Page
Create a new page from the Master page and click the Create Custom Content link.
Drag the CreateUserWizard control to the page from the Login section in the ASP.NET Controls.
The Create User
Wizard control
Creating a Dynamic Web Site 145
The user page is ready, now save and preview the page, create-user.aspx.
Fill in the form and click the Create User button.
It may take a few minutes to complete creating the new user for the first time
because development server is creating a new user database to store the users’ information in the background. You can see the user database in the App_Data
folder.
The following message shows that the user has been created successfully and you can create many users in the same way.
To check the new user;
Preview the login page.
Type the user name and password and click the Log In button. The home page opens.
Securing the links with the login page
Open the page each_type.aspx, click Edit Templates and select
ItemTemplate.
Drag the CreateUserWizard control to the ItemTemplate section from
ASP.NET Controls>Login.
The Login control with Anonymous Template
146Chapter 7
The LoginView has two views: The AnonymousTemplate and LoggedInTemplate.
The AnonymousTemplate is used to show the links when you are NOT logged in.
LoggedInTemplate is used to show the links when you are logged in.
Select the AnonymousTemplate and drag the LoginStatus control to the
LoginView section.
The Login Status control
The LoginStatus also has two views: Logged Out and Logged In.
Change the LoginText in the Tag Properties.
Changing the
Login Status text
Select LoggedInTemplate view for the LoginView and add the links to be viewed by logged in users.
The Login View with the
Logged in Template
Select the Logged In view in the LoginStatus.
The Login Status with the
Logged In view
Save and preview the page.
Click the Login to Modify link, type the user name and password, click the Log In button.
You are now logged in. The links to modify and the Logout link are visible.
Creating a Dynamic Web Site 147
To allow access to particular user only and deny everyone else
If you want to protect a page and allow access to a particular user, add the following code to the web.config page.
<location path=”search.aspx”> <system.web> <authorization>
<allow users=”mesay“/> <deny users =”*” /> </authorization> </system.web> </location>
The page |
|
is now protected and only the user |
|
can open the |
page, other users cannot. |
|
|
||
Searching in the database
You can do searching in a database and show the found items on the page.
Open the page search.aspx and click the Create Custom Content link.
Drag and drop an asp.net text box control and an asp.net button onto your page.
Drag and drop the AccessDataSource control to the page from ASP.NET Controls>Standard and click the Configure Data Source link.
Choose a database and click Next.
Select the fields that you want to display and check the ‘Return only unique rows’ box.
148Chapter 7
Click the WHERE button to add a where clause and make the settings like in the following picture, click the Add button and then OK.
Adding a condition to the Where clause
It searches the text, written in the TextBox1, in the long column of the database and it gets the records with the similar (like) text.
The following SQL Select statement is prepared.
Click the Next button, test the query and finish the wizard.
Drag and drop a the DataList control and choose the data source.
Select the button, type a name for the button in the Text property and type the current page name (which you are working on) for the PostBackUrl property.
Changing button properties
Save and preview the page, check how it is working.
Preview the page
Creating a Dynamic Web Site 149
Subject: Create a dynamic web site about your favorite sport.
Required features:
1.Creating a dynamic web site
2.Uploading pictures
3.Creating a Login Page
4.Creating a New User Page
5.Searching in the database
1
2 3
|
|
5 |
|
4 |
|||
|
|
||
|
|
|
150Chapter 7