Introduction

38
Beginning Web Site Development Module 2 – Web Data Building Data-Driven Sites With ASP.NET and C# Version

TAGS:

description

Beginning Web Site Development Module 2 – Web Data Building Data-Driven Sites With ASP.NET and C# Version. Introduction. Target audience New to programming but want to build a dynamic data-backed Web site Prerequisites Basic understanding of HTML, familiarity with Web interfaces - PowerPoint PPT Presentation

Transcript of Introduction

Page 1: Introduction

Beginning Web Site DevelopmentModule 2 – Web DataBuilding Data-Driven SitesWith ASP.NET and

C# Version

Page 2: Introduction

IntroductionTarget audience

New to programming but want to build a dynamic data-backed Web site

PrerequisitesBasic understanding of HTML, familiarity with Web interfacesCompleted “Beginning Web Site Development Module 1”

ExpectationsLearn the basics of building dynamic data-backed Web sites with Visual Web Developer Express and ASP.NET 2.0

Page 3: Introduction

AgendaDynamic, data-driven sitesUsing SQL Server 2005 Express

Creating and using local databasesStructured Query Language (SQL)

Talking to a database with SQLData binding

Binding ASP.NET controls to data

Page 4: Introduction

Dynamic Web SitesMany sites today are dynamic and interactive

Display content that is updated frequently

News sites, sports sites, stock analysis sitesAllow clients to interact with site

Shopping sites, internet portals, auction sitesInteraction requires storage…

Page 5: Introduction

Saving client-entered dataWhere should user-entered data go?

Client BrowserWeb Server

AddPoem.aspx

AddPoem.aspx.cs

?

Page 6: Introduction

Saving client-entered dataProblem: interactive Web pages need a place to store dataSolution: relational database

Store data in tabular format (think spreadsheet)Handles multiple users simultaneouslyStandard language (SQL) and many tools for manipulating data

Page 7: Introduction

SQL Server 2005 ExpressVWD Express installs SQL 2005 Express

Local file-based database engineFull SQL support, databases up to 4GBEasy to deploy – copy database file (.mdf) to deployment server

Page 8: Introduction

Creating a databaseAdd SQL 2005 Express database

Stores data in tables you define Rightclick

Page 9: Introduction

Database tablesDatabases store data in tables

Conceptually similar to spreadsheets

Each table is described as a collectionof columns, each storing a specific type of data

A table contains rows of data that conform to the table description

Page 10: Introduction

Defining a tableCreate table(s) to store data

Separate column for each attributeUnique ID column

Rightclick

Page 11: Introduction

Identity columnsIdentity column

Column storing a unique number for each row

Good practice to have an identity column

Improves performance, adds flexibilityUnique ID generated for each new entry

Page 12: Introduction

Filling tables with dataYou can add data to tables you create

Initial seed data or complete data for tables that store read-only data (like a list of items and their prices)

Rightclick

Page 13: Introduction

Creating a SQL 2005 Express Database

• Creating the initial database• Adding tables• Specifying identity columns• Populating table data

Page 14: Introduction

SQLStructured Query Language (SQL)

Standard way to retrieve data from and modify data in a databaseBasic understanding necessary to use ASP.NET data controls

Four standard operations for manipulating and retrieving data

SELECT

INSERT

UPDATE

DELETE

Page 15: Introduction

Testing queriesVWD Express Database Explorer provides query builder

Rightclick

RunQuery

Tables in querylisted here

Columns in querylisted here

Query text

Query results

Page 16: Introduction

SELECTing dataSQL method for retrieving data is SELECTSELECT ID, Author, Quote FROM Quotes

Column names Table name=

Page 17: Introduction

Constraining with WHERECan add criteria to constrain results of SELECT with WHERE clauseSELECT ID, Author, Quote FROM Quotes WHERE (Author = 'William Shakespeare')=SELECT ID, Author, Quote FROM Quotes WHERE (Author LIKE '%ea%')=

Page 18: Introduction

INSERTing rowsSQL method for inserting rows is INSERT

INSERT (Author, Quote) INTO Quotes VALUES ('Me', 'Life is good!')

Column names Table name

Values to insert

Page 19: Introduction

UPDATEing rowsSQL method for updating rows is UPDATE

UPDATE Quotes SET Author='Joe' WHERE ID=3

Table name New column value(s)

Constraint (which row(s) )

Page 20: Introduction

DELETEing rowsSQL method for deleting rows is DELETE

DELETE FROM Quotes WHERE ID=3

Table name

Constraint (which row(s) )

Page 21: Introduction

Interacting with a database using SQL

• Selecting data• Inserting data• Updating data• Deleting data

Page 22: Introduction

Data bindingData binding

A mechanism for displaying and modifying dynamic data from a Web page

ASP.NET supports data bindingCan point controls to database table as source for dataDisplayed content drawn from tableInterface for modifying data built into some controls (update, delete, insert)

Page 23: Introduction

Data bindingClient Browser Web Server

Default.aspx

Quotes DatabaseData-

binding

Page 24: Introduction

Binding controls to dataSeveral ASP.NET controls designed to bind to data

GridViewDisplay/edit a database table as a grid

DetailsView Display one table row at a time, insert new items

BulletedList Display a list of items from a table

Many more …

Page 25: Introduction

SqlDataSource controlSqlDataSource control handles data retrieval, inserts, updates, and deletes

Acts as bridge between database and data-bound controlContains SQL statements to perform database calls<asp:SqlDataSource ID="QuotesDataSource" runat="server" SelectCommand="SELECT ID, Author, Quote FROM Quotes" ConnectionString="…"/>

Page 26: Introduction

Adding a GridView

1. Set page to Design mode

2. Open Database Explorer3. Drag table onto page4. Select desired options5. Optionally Auto Format…6. Edit Columns and setID column Visible=false

Page 27: Introduction

Generated source<asp:GridView ID="GridView1" runat="server" AllowSorting="True" AutoGenerateColumns="False" DataSourceID="SqlDataSource1" EmptyDataText=“No records."> <Columns> <asp:BoundField DataField="ID" HeaderText="ID" ReadOnly="True" SortExpression="ID" Visible="False" /> <asp:BoundField DataField="Author" HeaderText="Author" SortExpression="Author" /> <asp:BoundField DataField="Quote" HeaderText="Quote" SortExpression="Quote" /> </Columns></asp:GridView><asp:SqlDataSource ID="SqlDataSource1" runat="server" SelectCommand= "SELECT ID, Author, Quote FROM Quotes" ConnectionString= "<%$ ConnectionStrings:QuotesConnectionString1 %>"/>

<configuration> <connectionStrings> <add name="QuotesConnectionString1" connectionString="Data Source=… " providerName="System.Data.SqlClient" /> </connectionStrings></configuration>

web.configDefault.aspx

GridView declaration

BoundFields for columns

SqlDataSource declarationSQL query to retrieve dataConnection string pointingto local Quotes.mdf file

Page 28: Introduction

Adding a GridView

• Adding a GridView to display table data• SqlDataSource control• Enabling sorting and paging• Formatting the GridView

Page 29: Introduction

SQL parametersSQL supports parameters to fill values in dynamically

SQL Server syntax is @varnameBefore executing statement, parameters must be associated with values

UPDATE Quotes SET Author=@Author WHERE ID=@ID

parameters

Page 30: Introduction

SqlDataSource parameters

How to associate parameters with SqlDataSource

<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ConnectionStrings:QuotesConnectionString1 %>" SelectCommand="SELECT [ID], [Author], [Quote] FROM [Quotes]" UpdateCommand="UPDATE Quotes SET Author=@Author, Quote=@Quote WHERE ID=@ID" DeleteCommand="DELETE FROM Quotes WHERE ID=@ID"> <UpdateParameters> <asp:Parameter Name="Author" Type="String" /> <asp:Parameter Name="Quote" Type="String" /> <asp:Parameter Name="ID" Type="Int32" /> </UpdateParameters> <DeleteParameters> <asp:Parameter Name="ID" Type="Int32" /> </DeleteParameters></asp:SqlDataSource>

Add Updateand Deletecommands with parameters

List parameternames and types

Note: Parameters should always be named the same as the correspondingcolumn names to work properly with the GridView and DetailsView controls

Page 31: Introduction

GridView updates and deletes

Once your SqlDataSource has Update and Delete commands, the GridView can be enabled with Update and Delete features

Must set DataKeyNamesto identity column name to support Update/Delete

Page 32: Introduction

GridView updating

Page 33: Introduction

Inserting with a DetailsView

DetailsView provides insert featureCan also be used to display/update/delete one row at a time

Configure new data source

Page 34: Introduction

Inserting with a DetailsViewAdd InsertCommand to data source

Enable Inserting and set DefaultMode=Insert<asp:SqlDataSource ID="SqlDataSource2" runat="server"

ConnectionString="<%$ConnectionStrings:QuotesConnectionString1 %>" SelectCommand="SELECT [ID], [Author], [Quote] FROM [Quotes]" InsertCommand="INSERT INTO Quotes (Author, Quote) VALUES (@Author, @Quote)"> <InsertParameters> <asp:Parameter Name="Author" Type="string" /> <asp:Parameter Name="Quote" Type="string" /> </InsertParameters></asp:SqlDataSource>

Page 35: Introduction

Inserting with a DetailsView

Page 36: Introduction

Updating, Deleting, and Inserting

• Enabling GridView Updating and Deleting• Using a DetailsView for inserting

Page 37: Introduction

SummaryInteractive sites make the internet what it is todayVWD Express includes database engine

SQL Server 2005 ExpressASP.NET supports data binding

Display database contentUpdate, insert, delete

Page 38: Introduction

ResourcesVWD 2005 Express home

http://msdn.microsoft.com/vstudio/express/vwd/default.aspx

SQL 2005 Express homehttp://msdn.microsoft.com/vstudio/express/sql/default.aspx

Writing Transact-SQL Statements Tutorial

http://msdn2.microsoft.com/en-us/library/ms365303.aspx

ASP.NET 2.0 QuickStart Tutorialshttp://quickstarts.asp.net/QuickStartv20/aspnet/Default.aspx

http://msdn.microsoft.com/vstudio/express/vwd/default.aspx
http://msdn.microsoft.com/vstudio/express/sql/default.aspx
http://msdn2.microsoft.com/en-us/library/ms365303.aspx
http://quickstarts.asp.net/QuickStartv20/aspnet/Default.aspx

voip-iptel-introduction-SRK1.ppt voip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-ip

voip-iptel-introduction-SRK1.ppt voip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-iptel-introduction-SRK1.pptvoip-ip

introduction | EinlEitung | introduction | introducción · introduction | EinlEitung | introduction | introducción En Description Operation Maintenance Safety instructions dE Benennung

introduction | EinlEitung | introduction | introducción · introduction | EinlEitung | introduction | introducción En Description Operation Maintenance Safety instructions dE Benennung

Introduction Section I: Introduction

Introduction Section I: Introduction

The Sacrament of Baptism Introduction Video Introduction Video The Sacrament of Baptism Introduction Video Introduction Video.

The Sacrament of Baptism Introduction Video Introduction Video The Sacrament of Baptism Introduction Video Introduction Video.

INTRODUCTION SPECIFICATIONS INTRODUCTION

INTRODUCTION SPECIFICATIONS INTRODUCTION

Topics Introduction 1 / 3 Introduction 2 / 3 Introduction 3 / 3.

Topics Introduction 1 / 3 Introduction 2 / 3 Introduction 3 / 3.

Introduction to Elasticsearch and Logstash. - KIT · PDF fileOutline 1 Introduction 2 Logstash Introduction 3 Elasticsearch Introduction 4 Conclusions Introduction Logstash ElasticsearchConclusions

Introduction to Elasticsearch and Logstash. - KIT · PDF fileOutline 1 Introduction 2 Logstash Introduction 3 Elasticsearch Introduction 4 Conclusions Introduction Logstash ElasticsearchConclusions

R as a Web Service Introduction Introduction Introduction

R as a Web Service Introduction Introduction Introduction

VisionaryScancombinesarichsetofqualitycontrolandproductivi ... · Introduction Introduction VisionaryScancombinesarichsetofqualitycontrolandproductivityfeatureswithasimpleinterfacedesignedspecificallyforscanningandcodingdepositionexhib-

VisionaryScancombinesarichsetofqualitycontrolandproductivi ... · Introduction Introduction VisionaryScancombinesarichsetofqualitycontrolandproductivityfeatureswithasimpleinterfacedesignedspecificallyforscanningandcodingdepositionexhib-

An Introduction to NSAn Introduction to NS2An Introduction to NS2 · 2016. 8. 26. · An Introduction to NSAn Introduction to NS2An Introduction to NS2 Textbook: T. Issariyakul and

An Introduction to NSAn Introduction to NS2An Introduction to NS2 · 2016. 8. 26. · An Introduction to NSAn Introduction to NS2An Introduction to NS2 Textbook: T. Issariyakul and

Industry introduction Industry introduction Company introduction Company introduction Production introduction Display time time content.

Industry introduction Industry introduction Company introduction Company introduction Production introduction Display time time content.

Introduction & Strategy Module Introduction & Administrative

Introduction & Strategy Module Introduction & Administrative

URBAN STREAM REHABILITATION. INTRODUCTION, OBJECTIVES & IMPACTS INTRODUCTION, OBJECTIVES & IMPACTS INTRODUCTION, OBJECTIVES & IMPACTS INTRODUCTION, OBJECTIVES.

URBAN STREAM REHABILITATION. INTRODUCTION, OBJECTIVES & IMPACTS INTRODUCTION, OBJECTIVES & IMPACTS INTRODUCTION, OBJECTIVES & IMPACTS INTRODUCTION, OBJECTIVES.

INTRODUCTIONS (LEADS) Academic introduction Creative introduction Action introduction Dialogue introduction Overarching societal statements Personal introduction.

INTRODUCTIONS (LEADS) Academic introduction Creative introduction Action introduction Dialogue introduction Overarching societal statements Personal introduction.

Introduction Introduction (ctnd.)

Introduction Introduction (ctnd.)

1. INTRODUCTION • INTRODUCTION • EINFÜHRUNG • INLEIDING • INTRODUCCIÓN … · 2016-12-16 · 1. INTRODUCTION • INTRODUCTION • EINFÜHRUNG • INLEIDING • INTRODUCCIÓN

1. INTRODUCTION • INTRODUCTION • EINFÜHRUNG • INLEIDING • INTRODUCCIÓN … · 2016-12-16 · 1. INTRODUCTION • INTRODUCTION • EINFÜHRUNG • INLEIDING • INTRODUCCIÓN

Introduction Chapitre 1 · Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

Introduction Chapitre 1 · Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

§1.1.1 INTRODUCTION: 1. INTRODUCTION

§1.1.1 INTRODUCTION: 1. INTRODUCTION

Introduction€¦ · Introduction ThisdocumentprovidesinformationabouttheIOSXEsoftwarereleasefortheCiscoNCS4201andCisco …

Introduction€¦ · Introduction ThisdocumentprovidesinformationabouttheIOSXEsoftwarereleasefortheCiscoNCS4201andCisco …

Systems Analysis I introduction I introduction. 2Systems Analysis - Introduction Contents Introduction Introduction 3 classic phases 3 classic phases.

Systems Analysis I introduction I introduction. 2Systems Analysis - Introduction Contents Introduction Introduction 3 classic phases 3 classic phases.