Header Ads Widget

Responsive Advertisement

Ticker

6/recent/ticker-posts

CS202 Assignment 3 Solution Fall 2022

 

CS202 Assignment 3 Solution 3 Fall 2022 2021

Virtual polytech.



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: virtualpolytech.blogspot.com


Post a Comment

0 Comments