Learning Area PROGRAMMING 12
Learning Delivery Modality MDL
Crecencia Drusila Lopez
GRADE 12
School Senior High School Grade Level
AILEEN D. ENRIQUEZ Learning
ICT
LESSON Teacher Area
EXEMPLAR Teaching Week 3 and 4
4th
Date Quarter
Teaching
8 days
Time No. of Days
I. OBJECTIVES
The learners demonstrate an understanding of
principles and concepts in developing
A. Content Standards ASP.NET MVC 5 Web applications
The learners independently develop ASP.NET MVC
B. Performance Standards 5 Web applications
Create custom URLs and apply style
C. Most Essential Learning Competencies to ASP.NET MVC Web applications.
(MELC) (If available, write the indicated TLE_ICTP.NET 11-12DAMWAIIIb-f-39
MELC)
Web Forms
Web Services
II. CONTENT Enumerating ASP.NET features
III. LEARNING RESOURCES
A. References
Programming in .Net Programming Curriculum
a. Teacher's Guide Pages Guide page23
b. Learner's Materials Pages
c. Textbook Pages
https://www.w3schools.com/asp/default.asp
d. Additional Materials from Learning https://www.youtube.com/watch?v=BfEjDD8mWYg
Resources
B. List of Learning Resources for
Youtube, Google Form, OBS, Notebook and pen,
Development and Engagement
cellphone, any slide presentation app.
Activities
IV. PROCEDURES
What I need to Know
At the end of the lesson, students are able to
Explain the function of webforms
Identify the steps in Creating an HTML Input
Page
Identify the steps in Identify the steps in
A. Introduction Creating an HTML Input Page
Warm-up
1. Attendance using google forms/messenger
or poll
B. Development What I know?
Activity 1:
Pre-Assessment Quiz
Write TRUE if the answer is correct and FALSE if
otherwise
1. A form is a section of an HTML document
where you put input controls (text boxes,
check boxes, radio buttons, and pull-down
lists).
2. Webforms are easily done in razor form
3. The server creates a variable called Client.
4. The HTML page has a drop-down list (a
<select> element) named Choice.
5. In the HTML page there is an <img> element
to display the image.
Answer key
1. TRUE
2. TRUE
3. FALSE
4. TRUE
5. TRUE
What’s New?
A form is a section of an HTML document where
you put input controls (text boxes, check boxes,
radio buttons, and pull-down lists).
Creating an HTML Input Page
<!DOCTYPE html>
<html>
<body>
@{
if (IsPost)
{
string companyname =
Request["CompanyName"];
string contactname =
Request["ContactName"];
<p>You entered: <br>
Company Name: @companyname <br>
Contact Name: @contactname </p>
}
else
{
<form method="post" action="">
Company Name:<br>
<input type="text" name="CompanyName"
value=""><br>
Contact Name:<br><br>
<input type="text" name="ContactName"
value=""><br><br>
<input type="submit" value="Submit"
class="submit">
</form>
}
}
</body>
</html>
Razor Example - Displaying Images
Suppose you have 3 images in your image folder,
and you want to display images dynamically by the
users choice.
This is easily done by a little Razor code.
If you have an image called "Photo1.jpg" in your
images folder on your web site, you can display
the image using an HTML <img> element like this:
<img src="images/Photo1.jpg" alt="Sample" />
Watch the video tutorial on Creating Webforms
C. Engagement What other enrichment activities can I
engage in?
ACTIVITY 2:
Code the example to see how to create a webform
D. Assimilation What I have learned
Activity 3: Quiz
Write TRUE if the answer is correct and FALSE if
otherwise
6. A form is a section of an HTML document
where you put input controls (text boxes,
check boxes, radio buttons, and pull-down
lists).
7. Webforms are easily done in razor form
8. The server creates a variable called Client.
9. The HTML page has a drop-down list (a
<select> element) named Choice.
10. In the HTML page there is an <img> element
to display the image.
Answer key
6. TRUE
7. TRUE
8. FALSE
9. TRUE
10. TRUE
What can I do? (Assessment)
Activity 4:
Create your own example of a webpage form.
Rubric:
3 points - Completeness of answer
5 points - Clarity
2 points - Neatness
A. REFLECTION (Reflection on the Type of
Formative Assessment Used for This
Particular Lesson)
