1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha...

16
1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gma Information Technology(IT) Welcome to study Web-Development with ASP

Transcript of 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha...

Page 1: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

1

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

Information Technology(IT)

Welcome to studyWeb-Development with ASP

Page 2: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

2

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

Course Outline Web-Development with ASP

1-Overview about Internet and HTML

2-Introduction ASP

3-Object ASP

4-FileSystemObject

5-Database( ADO )

Page 3: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

3

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

Objective

Objective:Objective:

សិ�ក្សា�អំ�ពី�ការបង្កើ ��តង្កើ�ហទំ�ពី�រសិម្រា�ប�ការង្កើម្រាប�ម្រា�សិ�ង្កើម្រា��នយ៉ា� ម្រាបង្កើយ៉ាជន�សិ�ខាន���ង្កើ �ម្បី"�សិ�សិ#�នសិម្បីត$ភាពីង្កើរ&នឬម្រា(វម្រា* វអំ�ពី�ភា(រក្សាម្បី+វ ,ធី�Programming language ង្កើ/យខ្លួ23នឯ �ន។

Page 4: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

4

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

Chapter I : Overview about Internet and HTML

a-Internet -Language use to create website : HTML,ASP,ASP.net,PHP,JSP, Javascript,vbscript....http://www.w3schools.com -Tools: notepad,VS(Visual Studio.net),Dreamweaver,Netbean,eclip.. -Type of Website have 2 1-Static site 2-Dynamic site DBMS: MS-access,Oracle ,SQL,MySQL.. WebServer: IIS,apache,Jrun,Tomcat.. WebBrowser: IE,firefox,Netscap,safery,chrome.. URL : Uniform Resource Locator URI : Uniform Resource Indicator

b-HTML

Page 5: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

5

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

b-HTML

1-format tag 2-image 3-table 4-links and anchor 5-css 6-form Detail: http://w3schools.com/html/default.asp ___________________

Page 6: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

6

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

1-format tag <b> <i> <u> <h1> : <h6> <p> <div> <br> <hr> &nbsp; <font color:red … > <marquee > : _________

Page 7: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

7

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

2-image , 3-table , 4-links and anchor

2- <img src=url border=size width=... height=... align=...> 3- <table border=... width=... height=.... cellpadding=.... cellspacing=.... align= >

-text in table -image in table -table in table

4- Welcome to Visited Cambodia -Text link -image link -new windows =target=... anchor =go to another place in page.

Page 8: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

8

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

5-css What is CSS? * CSS stands for Cascading Style Sheets * Styles define how to display HTML elements * External Style Sheets can save a lot of work * External Style Sheets are stored in CSS files

Syntax: Please check url =====================អំត$ម្រាបង្កើយ៉ាជន�:

Page 9: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

9

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

អត្ថ�ប្រ�យោ�ជន៍:

-ងាយម្រាសិ8លក្សា:; ការសិរង្កើសិរក្សា< ex:ង្កើប��ន១០pageង្កើពីលកែក្សារម្រាត@វ�<លទាំ� ម្រា�ប� កែតង្កើពីលខ្លួ2Bអា�ង្កើD2�...

-កាត�បន$យការសិរង្កើសិរក្សា< ex: ម្រាEន�កែតង្កើម្រាប�H1 �នcolor red រ 3�ង្កើម្រាសិ�...

-ងាយម្រា�ប�ម្រា� ក្សា< ex: File �ន ៣២១ lines កែតង្កើយ� អា�បម្រា 8ម្បីសិល�កែត១០០ lines...

Page 10: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

10

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

***Three Ways to Insert CSS

There are three ways of inserting a style sheet:

* External style sheet * Internal style sheet * Inline style

Page 11: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

11

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

Ex. Using CSS ?

Please check URL: w3schools.com

Page 12: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

12

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

6- Form (Interface Design)

Syntax:

<form name=form_name action=url method=post/get>

Elements of Form </form>

Page 13: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

13

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

Elements of form(controls/components/items/objects)

Type DescriptionText =>textbox Password =>passwordSubmit =>buttonReset =>button ResetFile =>button for uploads fileTextarea =>textareaSelect =>Combobox/Dropdownlist �;�ធ្លា2 ក្សា�Radio =>សិម្បីIប�ជIសិង្កើរ Jសិ�នកែតម្បី3យCheckbox =>សិម្បីIប�ជIសិង្កើរ Jសិ�ន�Iន:Ex:

Page 14: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

14

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

Example 1:

Save: example1.html

<FORM > Username: <INPUT type="text" size="10" maxlength="30"><BR> Password: <INPUT type="password" size="10" maxlength="30"> <INPUT type="Submit" VALUE="Submit"> </FORM>

Page 15: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

15

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

Example 1:

Save: example2.html

<FORM > <fieldset style="width:230"><legend title="123">Login</legend> Username: <INPUT type="text" size="10" maxlength="30"><BR> Password: <INPUT type="password" size="10" maxlength="30"> <INPUT type="Submit" VALUE="Submit"> </fieldset> </FORM>

Page 16: 1 Web-Dev- Program. SETEC Institute Management Information System Web-Development -by Lay Ratha email: layratha@gmail.comlayratha@gmail.com ©-2011 Information.

16

Web-Dev- Program.S

ETE

C

Inst

itu

te

Managem

ent

Info

rmati

on S

yst

em

Web-Development -by Lay Ratha email: [email protected]©-2011

W3schools.com

អំន;វតKន� (Practice)