Scribd
Upload
38 views2 pages

UI Part B 1st

This document contains the code for an HTML form with fields to collect customer information for an ACTB connection portal. The form includes fields for customer name, email, phone number, connection type, scheme, and duration. It also includes a submit button to calculate the connection bill amount using JavaScript. There is a rental cost table that lists the monthly rental costs for different connection types. The JavaScript code defines a function to calculate the total monthly rental cost based on the duration and connection type selected.

Uploaded by

Arun Kumar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
38 views2 pages

UI Part B 1st

This document contains the code for an HTML form with fields to collect customer information for an ACTB connection portal. The form includes fields for customer name, email, phone number, connection type, scheme, and duration. It also includes a submit button to calculate the connection bill amount using JavaScript. There is a rental cost table that lists the monthly rental costs for different connection types. The JavaScript code defines a function to calculate the total monthly rental cost based on the duration and connection type selected.

Uploaded by

Arun Kumar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

1 <!

Doctype HTML>
2 <html>
3 <style>
4 body{
5 background-color: #eed426;
6 text-align: center;
7 }
8 h1{
9 color:#006666;
10 font-family: Verdana;
11 text-align: center;
12 }
13 table{
14 border-style: solid;
15 float: right;
16 }
17 table th{
18 text-align: center;
19 }
20 table td{
21 text-align: center;
22 }
23 </style>
24 <body>
25 <h1>ACTB Connection Portal</h1>
26 <form name="bill">
27 Customer Name <input type="text" name="custname" id="name"
placeholder="Enter the customer name"><br>
28 Customer Email <input type="email" name="email"
placeholder="[email protected]"><br>
29 Telephone/ Mobile Number <input type="text" name="mobile"
placeholder="Enter the Mobile Number" pattern="[789][0-9]{9}"><br>
30 Connection Type <select name="conntype" id="connectiontype">
31 <option value="Pre">Pre</option>
32 <option value="Post">Post</option>
33 </select><br>
34 Scheme Name <input type="radio" id="scheme1" value="Local">Local
35 <input type="radio" id="scheme2" value="STD">STD
36 <input type="radio" id="scheme3"
value="FullTalkTime">FullTalkTime<br>
37 Connection Duration <input type="number" id="dur" min="1" max="12"
name="duration"><br>
38 <input type="submit" id="sub" name="submit" value="Connection Bill
Amount" onclick="result()">
39 <input type="reset" id="cl" name="clear">
40 </form>
41 <div>
42
43 </div>
44 <p>Rental Cost Table</p>
45 <table border="1">
46 <tr><th>Connection Type</th><th>Call Limit</th><th>Monthly
Rental</th></tr>
47 <tr><td>Pre</td><td>500</td><td>75</td></tr>
48 <tr><td>Post</td><td>Unlimited</td><td>150</td></tr>
49 </table>
50 <script>
51 function result(){
52 var d=document.getElementById("dur").value;
53 var e=document.getElementById("connectiontype").value;
54 if(document.getElementById("scheme1").checked && e=="Pre"){
55 var x=(d*200)+75;
56 document.write("The Total Monthly Rental Cost is Rs. "+x);
57 }
58 }
59
60 </script>
61 </body>
62 </html>

You might also like