DOM Shopping: Difference between revisions
		
		
		
		Jump to navigation
		Jump to search
		
 Created page with "<pre id='shellbody' data-qtp='clicky'></pre> ==Multiply Quantity by Price== <div class=qu data-width=300> *You can enter the number of widgets *Multiply the number by the pric..."  | 
				|||
| Line 13: | Line 13: | ||
<div>Quantity <input id=quantity value='1'></div>  | <div>Quantity <input id=quantity value='1'></div>  | ||
<div><button id=recalculate>Recalculate</button></div>  | <div><button id=recalculate>Recalculate</button></div>  | ||
<div>Quantity <input id=total value='50'></div>  | <div>Quantity <input id=total value='50' disabled></div>  | ||
`;  | `;  | ||
</pre>  | </pre>  | ||
<pre class=ans>  | <pre class=ans>  | ||
document.body.innerHTML = `  | |||
<div>Price <input id=price disabled value='50'></div>  | |||
<div>Quantity <input id=quantity value='1'></div>  | |||
<div><button id=recalculate>Recalculate</button></div>  | |||
<div>Quantity <input id=total value='50' disabled></div>  | |||
`;  | |||
document.getElementById('recalculate').onclick = ()=>{  | |||
  document.getElementById('total').value =  | |||
    parseInt(document.getElementById('price').value) *  | |||
    parseInt(document.getElementById('quantity').value);  | |||
}  | |||
</pre>  | </pre>  | ||
</div>  | </div>  | ||
Revision as of 18:16, 10 October 2021
Multiply Quantity by Price
- You can enter the number of widgets
 - Multiply the number by the price to get total cost
 
{expr:[{id:'total',prop:"value"}],
 actions:[{id:'recalculate',method:"click"},{id:'qnty',value:"2"},{id:'recalculate',method:"click"},]}
document.body.innerHTML = ` <div>Price <input id=price disabled value='50'></div> <div>Quantity <input id=quantity value='1'></div> <div><button id=recalculate>Recalculate</button></div> <div>Quantity <input id=total value='50' disabled></div> `;
document.body.innerHTML = `
<div>Price <input id=price disabled value='50'></div>
<div>Quantity <input id=quantity value='1'></div>
<div><button id=recalculate>Recalculate</button></div>
<div>Quantity <input id=total value='50' disabled></div>
`;
document.getElementById('recalculate').onclick = ()=>{
  document.getElementById('total').value =
    parseInt(document.getElementById('price').value) *
    parseInt(document.getElementById('quantity').value);
}