CS202 Assignment 3 Solution Fall 2021

byadmin -
0

 

CS202 Assignment 3 Solution 3 Fall 2022 - 2021

Cognitive Help!.



Question :

Problem Statement: 

Suppose Saudi Arabia’s President Muhammad bin Salman gives a 200,000-person quota for Hajj to the Islamic Republic of Pakistan. Hajj will be allowed only for those persons who are fully vaccinated and got a booster shot. NCOC (National Command and Operation Centre) decided to develop a website to count the number of peoples who applied for Hajj and got booster shots respectively.

Suppose NCOC hired you to develop a website to maintain the record of those hajj nominees who have been injected with the booster shot.

The primary requirement is to show and update the count of nominees been injected with a booster dose.

So, when every new nominee comes to the center and is injected with a booster shot, you need to show the message and update the total count on the site without refreshing the page, so that concerned authorities can take a look at the current status of the nominees with a booster shot.

 

You will add the counter button with the functionality ‘on click’ of incrementing the number of nominees by 1.

Note: Suppose 18000 Nominees have already been injected with a booster shot, so you will start counting after it.

 

Sample output before adding any nominee record:



Record of each new nominee will append in new line with the message and count like shown in the following screenshot:

.





Requirements and Solution Instructions:

·         Make a simple web-page as given in sample.


Assignment Solution:


<!-- VIRTUAL POLYTECH -------   COGNITIVEHELPING -->
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>cs202 assignment 3 By Virtualpolytech</title>
    <style type="text/css">
        *{
            margin: 0px auto;
            padding: 0px auto;
        }
        .container{
            background-color: pink;
            height: 600px;
            margin: auto 20px;
            width: 100%;
        }
        .div1{
            background-color: blue;
            height: 70px;
            color: white;
            margin: 5px;
        }
        .div1 h1{
            padding: 10px;

        }
        .div2{
            width: 80%;
            height: 500px;
            background-color: darkgrey;
        }
        .div2 h2{
            widows: 90%;
            height: 70px;
            background-color: grey;
            display: inline-block;
            color: white;
            padding-top: 25px;

        }
        .div p{
            width: 93%;
            text-align: justify;
            font-weight: bold;
        }
        .div2 button{
            display: block;
            margin-left: 30px;
            margin-right: auto;
            width: 150px;
            height: 70px;
            background-color: white;
            border: 2px solid black;
            font-weight: bold;
        }
        #detail p{
            width: 93%;
            font-weight: bold;
        }
    </style>
</head>
<body>
    <center >
        <div class="container">
    <div class="div1">
        <h1>National Command and Operation Centre</h1>
    </div>
    <div class="div2">
        <h2>Importance Of booster Shots</h2>
        <p>Suppose Saudi Arabia’s President Muhammad bin Salman gives a 200,000-person quota for Hajj to the Islamic Republic of Pakistan. Hajj will be allowed only for those persons who are fully vaccinated and got a booster shot. NCOC (National Command and Operation Centre) decided to develop a website to count the number of peoples who applied for Hajj and got booster shots respectively.
Suppose NCOC hired you to develop a website to maintain the record of those hajj nominees who have been injected with the booster shot.
The primary requirement is to show and update the count of nominees been injected with a booster dose.
So, when every new nominee comes to the center and is injected with a booster shot, you need to show the message and update the total count on the site without refreshing the page, so that concerned authorities can take a look at the current status of the nominees with a booster shot.

You will add the counter button with the functionality ‘on click’ of incrementing the number of nominees by 1.
Note: Suppose 18000 Nominees have already been injected with a booster shot, so you will start counting after it.
</p>
        <button>Insert New Nominee</button>
        <div id="detail">
            <p></p>
        </div>
    </div>

</center>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var start =0;
            var num = 18000;

        $("button").click(function(){
            $("#detail").append("<p> Another Nominee Inserted with booster shot.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Nominee Number : <span>" + num + " </span></p>");
            num++;
        });
        });
    </script>
</body>
</html>


More Assignment Solutions: cognitivehelping.blogspot.com


How to save File and Use :

  1. Fist Copy the Upper Code from <html> to </html>   
  2. Then paste it to Any text editor wich you use like; notepad;-
  3. Click Save or Save as , name the file with .html extension like: cs202.html
  4. And check the extra code or links care fully and then use it





Instructions:

 

Please read the following instructions carefully before submitting assignment. It should be clear that your assignment will not get any credit if:

 

§  The assignment is submitted after due date.

§  The submitted assignment does not open or file is corrupt.

§  Assignment is copied (partial or full) from any source (websites, forums, students, etc)

 

Note: You have to upload .html file which contain required code. In case you are unable to upload .html file, then please upload .zip or .rar file. Assignment in any other format (extension) will not be accepted and will be awarded with zero marks.




Tags:

Post a Comment

Previous Post Next Post