Having a hard time with this The test I run with AJAX work but I can\'t get the
ID: 3583740 • Letter: H
Question
Having a hard time with this The test I run with AJAX work but I can't get the info to go from the HTML page back to the page_Load webservice to work and back again to the Table.
Here is what i am doing.
Create a new WEB SITE to develop a layout for shopping cart and apply CSS. in vb.net Write the necessary methods to add and remove contents from the cart. Add shopping cart functionality to your project. Here are the requirements 1) The front end page must be HTML (not web form ASPX) 2) The page should contain at least one select box to contain categories, and one table/select box for items 3) The user will select the category from the select box, then the table/select box will be filled with items based on the first selection. 4) The user will select an item to be added to the cart 5) Add functionality to remove, edit or delete to the cart 6) Create a button to display the content of the cart with option to continue shopping 7) On exist, ask for the customer info, such as name, address,... 8) Do not use any databases. The content (data) of any of the select boxes can come from the service. Use any web services technique, such as Page_Load, Web method, or WEB API2 (Do not use standard MVC)
Explanation / Answer
<!DOCTYPE html>
<html>
<head>
<title>Shopping Cart</title>
<style type="text/css">
.red{
background-color: red;
}
.green{
background-color: green;
}
</style>
</head>
<body>
<div id="cart">
<h3>Your Cart</h3>
<div id="itemSelected">
<table border="1">
<tr>
<th>S. No.</th>
<th>Item Name</th>
<th>Cost</th>
<th>Edit</th>
</tr>
</table>
</div>
</div>
<div>
<h3>Select Items from list</h3>
<table border="1">
<tr>
<th>S. No.</th>
<th>Item Type</th>
<th>Name</th>
<th>Company</th>
<th>Cost</th>
<th>Tools</th>
</tr>
<tr></tr>
<th>1</th>
<th>Bag</th>
<th>Backpack</th>
<th>Wildcraft</th>
<th>1,400</th>
<th>
<button id="button_1" class="green">Select</button>
</th>
<tr>
<th>2</th>
<th>Bag</th>
<th>Laptop Bag</th>
<th>Wildcraft</th>
<th>3,300</th>
<th>
<button id="button_2" class="green">Select</button>
</th>
</tr>
<tr>
<th>3</th>
<th>Pen</th>
<th>Linc glycer</th>
<th>Linc</th>
<th>10</th>
<th>
<button id="button_3" class="green">Select</button>
</th>
</tr>
<tr>
<th>4</th>
<th>Pencil</th>
<th>Smooth Write</th>
<th>Linc</th>
<th>5</th>
<th>
<button id="button_4" class="green">Select</button>
</th>
</tr>
<tr>
<th>5</th>
<th>Copy</th>
<th>Plain</th>
<th>Classmate</th>
<th>100</th>
<th>
<button id="button_5" class="green">Select</button>
</th>
</tr>
<tr>
<th>6</th>
<th>Pendrive</th>
<th>Sandisk 16GB</th>
<th>Sandisk</th>
<th>700</th>
<th>
<button id="button_6" class="green">Select</button>
</th>
</tr>
<tr>
<th>7</th>
<th>Calculator</th>
<th>Scientific Calc</th>
<th>Casio</th>
<th>1,100</th>
<th>
<button id="button_7" class="green">Select</button>
</th>
</tr>
<tr>
<th>8</th>
<th>Memory Card</th>
<th>Sandisk Card 4GB</th>
<th>Sandisk</th>
<th>500</th>
<th>
<button id="button_8" class="green">Select</button>
</th>
</tr>
<tr>
<th>9</th>
<th>Kindle</th>
<th>Kindle 7.1</th>
<th>Amazon</th>
<th>8,999</th>
<th>
<button id="button_9" class="green">Select</button>
</th>
</tr>
<tr>
<th>10</th>
<th>Bottle</th>
<th>Drinking Bottle</th>
<th>XYZ</th>
<th>50</th>
<th>
<button id="button_10" class="green">Select</button>
</th>
</tr>
</table>
</div>
</body>
<script type="text/javascript">
var itemsList=[10]; //initiallizing array in javascript of size 10
for(i=0; i<10; i++){ //for loop javascript
itemsList[i]=0;
}
//two dimensional array
var items=[["0","Backpack","1400"],["0","Laptop Bag","3300"],["0","Linc glycer","10"],["0","Smooth Write","5"],["0","Plain","100"],["0","Sandisk 16GB","700"],["0","Scientific Calc","1100"],["0","Sandisk Card 4GB"],["0,Kindle","8999"],["0","Drinking Bottle","35"]];
function selectRemove(id,button,name,cost){
if(itemsList[id]==0){
itemsList[id]=1;
document.getElementById(button).innerHTML="Remove";
document.getElementById(button).classList.remove("green");
document.getElementById(button).classList.add("red");
}
else{
itemsList[id]=0;
document.getElementById(button).innerHTML="Select";
document.getElementById(button).classList.remove("red");
document.getElementById(button).classList.add("green");
}
updateCart(name,cost,id);
}
function updateCart(name,cost,id){
var cartTable="<table border='1'><tr><th>S. No.</th><th>Item Name</th><th>Cost</th><th>Edit</th></tr>";
var sno=1;
for(i=0; i<10; i++){
if(itemsList[i]==1){
cartTable+="<tr><th>"+sno.toString()+"</th><th>"+items[i][1]+"</th><th>"+items[i][2]+"</th><th>Edit</th></tr>";
sno++;
}
}
cartTable+="</table>";
// alert(cartTable);
document.getElementById("itemSelected").innerHTML=cartTable;
}
</script>
</html>
Related Questions
drjack9650@gmail.com
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.