Question

In: Computer Science

can someone make me a shopping cart for me ? i need to make a shopping...

can someone make me a shopping cart for me ?

i need to make a shopping cart ,but i have no idea about how to do this

i have made 3 line of items , this is one of the pruduct line

line 1

-------------------------------------

<!DOCTYPE html>

<html lang="en">

<head>

<style>

.div1 {

border: 2px outset red;

background-color: lightblue;

text-align: center;

}

</style>

</head>

<!-- body -->

<body style="background-color:silver; "class="main-layout position_head">

<!-- loader -->

</li>

</ul>

</section>

</nav>

</section>

</header>

<!-- end header inner -->

<!-- end header -->

<!-- Our Glasses section -->

<section class="glasses">

<section class="container">

<section class="row">

<section class="titlepage">

<center><h2>Our Glasses</h2></center>

<marquee width="100%" direction="left" height="100px">

<p style="color:blue;">In this glasses shop, you can find the glasses you want，this is a galsses shop ,and can buy glasses.

</p>

</section>

<section class="container-fluid">

<section class="row">

<section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">

<section class="glasses_box">

<figure><img src="images/glass1.png" alt="#"/></figure>

<h3><span class="blu">$</span>50</h3>

<p>Sunglasses</p>

<p>Sunglasses1 ，this sun glass can use to do something 1 Works on myopia</p>

</section>

</section>

<section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">

<section class="glasses_box">

<figure><img src="images/glass2.png" alt="#"/></figure>

<h3><span class="blu">$</span>50</h3>

<p>Sunglasses</p>

<p>Sunglasses1 ，this sun glass can use to do something 1 Works on myopia introduction </p>

</section>

</section>

<section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">

<section class="glasses_box">

<figure><img src="images/glass3.png" alt="#"/></figure>

<h3><span class="blu">$</span>50</h3>

<p>Sunglasses</p>

</section>

</section>

<section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">

<section class="glasses_box">

<figure><img src="images/glass4.png" alt="#"/></figure>

<h3><span class="blu">$</span>50</h3>

<p>Sunglasses</p>

</section>

</section>

<section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">

<section class="glasses_box">

<figure><img src="images/glass5.png" alt="#"/></figure>

<h3><span class="blu">$</span>50</h3>

<p>Sunglasses</p>

</section>

</section>

<section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">

<section class="glasses_box">

<figure><img src="images/glass6.png" alt="#"/></figure>

<h3><span class="blu">$</span>50</h3>

<p>Sunglasses</p>

</section>

</section>

<section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">

<section class="glasses_box">

<figure><img src="images/glass7.png" alt="#"/></figure>

<h3><span class="blu">$</span>50</h3>

<p>Sunglasses</p>

</section>

</section>

<section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">

<section class="glasses_box">

<figure><img src="images/glass8.png" alt="#"/></figure>

<h3><span class="blu">$</span>50</h3>

<p>Sunglasses</p>

</section>

</section>

<section class="col-md-12">

<a class="read_more" href="#">Read More</a>

</section>

</section>

</section>

</section>

<!-- end Our Glasses section -->

<!-- footer -->

<footer>

<section class="footer">

<section class="container">

<section class="row">

<ul class="location_icon">

<li><a href="#"><i class="fa fa-map-marker" aria-hidden="true"></i></a><br> Location</li>

<li><a href="#"><i class="fa fa-phone" aria-hidden="true"></i></a><br> +01 1234567890</li>

<li><a href="#"><i class="fa fa-envelope" aria-hidden="true"></i></a><br> [email protected]</li>

</ul>

</section>

</footer>

<!-- end footer -->

</body>

</html>

---------------

the line 2 and line 3 have almose the same code ,but only different for the items .

so ,i wantto make a order cart ,html and a css

  • arranged through the usage of table(s)
    For each product line, there must be a corresponding dropdown box and an input box
    The dropdown box shall list all the available selections as shown in the product line pages
    •   The input box must not allow more than a three-digit input (i.e. the customer may not enter values greater than 999 nor non-numeric values)
    •   Place a button at the bottom of this page with the caption that says “Order Now”
    •   Upon clicking this button, a message box must show up displaying a thank you message directed towards the customer
    •   Place a second button at the bottom of this page with the caption that says “Cancel”
    •   Upon clicking this button, a message box must show up displaying an appropriate message directed towards the customer
    •   JavaScript functions must be coded to handle this click-and-display-message scenario

can someone help me on this and give me some explain ?

thanks.

Solutions

Expert Solution

Your code was very badly written, I've improved at some areas to make it good.

HTML FILE

<!DOCTYPE html>
<html lang="en">
   <head>
   <style>
  .div1 {
         border: 2px outset red;
         background-color: lightblue;
         text-align: center;
         }
   </style>
   <script>
function maxLengthCheck(object) {
         if (object.value.length > object.maxLength)
           object.value = object.value.slice(0, object.maxLength)
         }
         
         function isNumeric (evt) {
         var theEvent = evt || window.event;
         var key = theEvent.keyCode || theEvent.which;
         key = String.fromCharCode (key);
         var regex = /[0-9]|\./;
         if ( !regex.test(key) ) {
           theEvent.returnValue = false;
           if(theEvent.preventDefault) theEvent.preventDefault();
         }
         }
             function orderfunction(){
                 alert("Thank you for ordering from my website!!!");    
             }
         
             function cancelfunction(){
                 alert("Thank you for your time");    
             }
   </script>
   </head>
   <!-- body -->
   <body style="background-color:silver; "class="main-layout position_head">
      <!-- loader -->
      </li>
      </ul>
      </section>
      </nav>
      </section>
      </header>
      <!-- end header inner -->
      <!-- end header -->
      <!-- Our Glasses section -->
      <section class="glasses">
      <section class="container">
      <section class="row">
         <section class="titlepage">
            <center>
               <h2>Our Glasses</h2>
            </center>
            <marquee width="100%" direction="left" height="100px">
               <p style="color:blue;">In this glasses shop, you can find the glasses you want，this is a galsses shop ,and can buy glasses.
               </p>
            </marquee>
         </section>
         <section class="container-fluid">
            <section class="row">
               <section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">
                  <section class="glasses_box">
                     <figure><img width="200px" height="100px" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcST_xwzDU6FVnqY1R7Yn7jBIiRcClElTQLv3g&usqp=CAU" /></figure>
                     <h3><span class="blu">$</span>50</h3>
                     <select name="dropdownbox">
                        <option value="value1">value1</option>
                        <option value="value2">value2</option>
                        <option value="value3">value3</option>
                     </select>
                     <br/><input name="myInput_DRS"
                        onkeypress="return isNumeric(event)"
                        oninput="maxLengthCheck(this)"
                        type = "number"
                        maxlength = "3"
                        min = "1"
                        max = "999" />
                     <p>Sunglasses</p>
                     <p>Sunglasses1 ，this sun glass can use to do something 1 Works on myopia</p>
                  </section>
               </section>
               <section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">
                  <section class="glasses_box">
                     <figure><img width="200px" height="100px" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcST_xwzDU6FVnqY1R7Yn7jBIiRcClElTQLv3g&usqp=CAU" /></figure>
                     <h3><span class="blu">$</span>50</h3>
                     <select name="dropdownbox">
                        <option value="value1">value1</option>
                        <option value="value2">value2</option>
                        <option value="value3">value3</option>
                     </select>
                     <br/><input name="myInput_DRS"
                        onkeypress="return isNumeric(event)"
                        oninput="maxLengthCheck(this)"
                        type = "number"
                        maxlength = "3"
                        min = "1"
                        max = "999" />
                     <p>Sunglasses</p>
                     <p>Sunglasses1 ，this sun glass can use to do something 1 Works on myopia introduction </p>
                  </section>
               </section>
               <section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">
                  <section class="glasses_box">
                     <figure><img width="200px" height="100px" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcST_xwzDU6FVnqY1R7Yn7jBIiRcClElTQLv3g&usqp=CAU" /></figure>
                     <h3><span class="blu">$</span>50</h3>
                     <select name="dropdownbox">
                        <option value="value1">value1</option>
                        <option value="value2">value2</option>
                        <option value="value3">value3</option>
                     </select>
                     <br/><input name="myInput_DRS"
                        onkeypress="return isNumeric(event)"
                        oninput="maxLengthCheck(this)"
                        type = "number"
                        maxlength = "3"
                        min = "1"
                        max = "999" />
                     <p>Sunglasses</p>
                  </section>
               </section>
               <section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">
                  <section class="glasses_box">
                     <figure><img width="200px" height="100px" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcST_xwzDU6FVnqY1R7Yn7jBIiRcClElTQLv3g&usqp=CAU" /></figure>
                     <h3><span class="blu">$</span>50</h3>
                     <select name="dropdownbox">
                        <option value="value1">value1</option>
                        <option value="value2">value2</option>
                        <option value="value3">value3</option>
                     </select>
                     <br/><input name="myInput_DRS"
                        onkeypress="return isNumeric(event)"
                        oninput="maxLengthCheck(this)"
                        type = "number"
                        maxlength = "3"
                        min = "1"
                        max = "999" />
                     <p>Sunglasses</p>
                  </section>
               </section>
               <section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">
                  <section class="glasses_box">
                     <figure><img width="200px" height="100px" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcST_xwzDU6FVnqY1R7Yn7jBIiRcClElTQLv3g&usqp=CAU" /></figure>
                     <h3><span class="blu">$</span>50</h3>
                     <select name="dropdownbox">
                        <option value="value1">value1</option>
                        <option value="value2">value2</option>
                        <option value="value3">value3</option>
                     </select>
                     <br/><input name="myInput_DRS"
                        onkeypress="return isNumeric(event)"
                        oninput="maxLengthCheck(this)"
                        type = "number"
                        maxlength = "3"
                        min = "1"
                        max = "999" />
                     <p>Sunglasses</p>
                  </section>
               </section>
               <section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">
                  <section class="glasses_box">
                     <figure><img width="200px" height="100px" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcST_xwzDU6FVnqY1R7Yn7jBIiRcClElTQLv3g&usqp=CAU" /></figure>
                     <h3><span class="blu">$</span>50</h3>
                     <select name="dropdownbox">
                        <option value="value1">value1</option>
                        <option value="value2">value2</option>
                        <option value="value3">value3</option>
                     </select>
                     <br/><input name="myInput_DRS"
                        onkeypress="return isNumeric(event)"
                        oninput="maxLengthCheck(this)"
                        type = "number"
                        maxlength = "3"
                        min = "1"
                        max = "999" />
                     <p>Sunglasses</p>
                  </section>
               </section>
               <section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">
                  <section class="glasses_box">
                     <figure><img width="200px" height="100px" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcST_xwzDU6FVnqY1R7Yn7jBIiRcClElTQLv3g&usqp=CAU" /></figure>
                     <h3><span class="blu">$</span>50</h3>
                     <select name="dropdownbox">
                        <option value="value1">value1</option>
                        <option value="value2">value2</option>
                        <option value="value3">value3</option>
                     </select>
                     <br/><input name="myInput_DRS"
                        onkeypress="return isNumeric(event)"
                        oninput="maxLengthCheck(this)"
                        type = "number"
                        maxlength = "3"
                        min = "1"
                        max = "999" />
                     <p>Sunglasses</p>
                  </section>
               </section>
               <section class="col-xl-3 col-lg-3 col-md-6 col-sm-6">
                  <section class="glasses_box">
                     <figure><img width="200px" height="100px" src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcST_xwzDU6FVnqY1R7Yn7jBIiRcClElTQLv3g&usqp=CAU" /></figure>
                     <h3><span class="blu">$</span>50</h3>
                     <select name="dropdownbox">
                        <option value="value1">value1</option>
                        <option value="value2">value2</option>
                        <option value="value3">value3</option>
                     </select>
                     <br/><input name="myInput_DRS"
                        onkeypress="return isNumeric(event)"
                        oninput="maxLengthCheck(this)"
                        type = "number"
                        maxlength = "3"
                        min = "1"
                        max = "999" />
                     <p>Sunglasses</p>
                  </section>
               </section>
               <section class="col-md-12">
                  <input onclick="orderfunction()" type="button" name="ordernow" value="Order Now" />
                  <input onclick="cancelfunction()"  type="button" name="cancel" value="Cancel" />
                  <a class="read_more" href="#">Read More</a>
               </section>
            </section>
         </section>
      </section>
      <!-- end Our Glasses section -->
      <!-- footer -->
      <footer>
         <section class="footer">
         <section class="container">
         <section class="row">
            <ul class="location_icon">
               <li><a href="#"><i class="fa fa-map-marker" aria-hidden="true"></i></a><br> Location</li>
               <li><a href="#"><i class="fa fa-phone" aria-hidden="true"></i></a><br> +01 1234567890</li>
               <li><a href="#"><i class="fa fa-envelope" aria-hidden="true"></i></a><br> [email protected]</li>
            </ul>
         </section>
      </footer>
      <!-- end footer -->
   </body>
</html>


Few points I would like to give you to focus more on good web page structure.

1. Don't use tags unnecessarily.
2. Make the CSS and JS files seperately.
3. Don't use tag more than twice when it can work with single use.


Thanks.

venereology answered 11 months ago
Next > < Previous

Related Solutions

I need someone to clarify one confusion to me , its regarding operations management. can someone...
I need someone to clarify one confusion to me , its regarding operations management. can someone explain the 3 strategies in aggregate capacity management in alot of details ( like 500 words) so I can understand about it more. the three strategies are (level, hybrid, and chase)
I need to write a program and can't seem to make it run properly. Someone can...
I need to write a program and can't seem to make it run properly. Someone can help with the coding? It's with python Thanks! Here is the program: The rules of Shut the Box are as follows (abbreviated version): + You have two 5-sided die + You have 5 wooden blocks (labeled 1 through 5) + Each turn, you roll the dice and knock down the blocks corresponding to the number on each die + You have to knock down...
can someone please answer for me that quaestions. please make sure that i understand your work...
can someone please answer for me that quaestions. please make sure that i understand your work and handwriting. thank you _____________________________________________________ 1. We will sketch some quadrics, but in order to make sure our graphs have some accuracy, we will project the surfaces onto the 3 coordinate planes. For each equation, draw four separate graphs for the surface S: i. the projection of S onto the xy-plane, ii. the projection of S onto the xz-plane, iii. the projection of S...
I need someone to describe these topics to me as the web makes it confusing. Thank...
I need someone to describe these topics to me as the web makes it confusing. Thank you. Money and financial banking. Monetary policy. The federal reserve. Functions of the federal reserve.
I need someone to create a program for me: Create a program that takes as input...
I need someone to create a program for me: Create a program that takes as input an employee's salary and a rating of the employee's performance and computes the raise for the employee. The performance rating here is being entered as a String — the three possible ratings are "Outstanding", "Acceptable", and " Needs Improvement ". An employee who is rated outstanding will receive a 10.2 % raise, one rated acceptable will receive a 7 % raise, and one rated...
Can someone please assist me with this question. The information that I found was not of...
Can someone please assist me with this question. The information that I found was not of help. Discuss how using systems thinking will influence your decision-making. I have to do a full paragraph on this question.
Can someone please explain the edgeworth box to me by typing in a way i can...
Can someone please explain the edgeworth box to me by typing in a way i can see and understand? what determines the contract curves path?
please i need from someone to do for me a English documented research essay on the...
please i need from someone to do for me a English documented research essay on the causes of the Lebanese economic crisis it should be composed from: introduction, body 1 , body 2 , body 3, rebuttal, conclusion, links of articles that have be used to get information.
9.) The 17 kg shopping cart carries a 73 kg child. The shopping cart wheel base...
9.) The 17 kg shopping cart carries a 73 kg child. The shopping cart wheel base b = 480 mm and its vertical CG is symmetrically located 580 mm above the floor surface. The child remains centered symmetrically between the cart wheels with her vertical CG located 750 mm above the floor surface. Determine (a) location above the floor of the vertical CG of the cart + child in mm and (b) the tipping angle in degrees.
I have to complete a template for pathophysiology , can someone tell me the pathophysiology of...
I have to complete a template for pathophysiology , can someone tell me the pathophysiology of pain. This is for a pathophysiology class
ADVERTISEMENT
Subjects
ADVERTISEMENT
Latest Questions
ADVERTISEMENT