Fix and add input values in calc
This commit is contained in:
		
					parent
					
						
							
								792219f6ac
							
						
					
				
			
			
				commit
				
					
						22a876e134
					
				
			
		
					 3 changed files with 22 additions and 9 deletions
				
			
		|  | @ -544,6 +544,7 @@ h6 { | |||
|     font-size: 20px; | ||||
|     text-align: right; | ||||
| } | ||||
| 
 | ||||
| .price-calc-section .text .section-heading::before{ | ||||
|     content: ""; | ||||
|     position: absolute; | ||||
|  | @ -592,10 +593,15 @@ h6 { | |||
|     justify-content: center; | ||||
|     align-items: center; | ||||
| } | ||||
| 
 | ||||
| .price-calc-section .card .description span{ | ||||
|     font-size: 20px; | ||||
|     margin-left: 4px; | ||||
| } | ||||
| .price-calc-section .card .description input{ | ||||
|    font-size: 20px; | ||||
|     text-align: center; | ||||
| } | ||||
| .price-calc-section .card .description i{ | ||||
|     color: #29427A; | ||||
|     cursor: pointer; | ||||
|  |  | |||
|  | @ -94,21 +94,27 @@ | |||
|             var data = $(this).data('minus'); | ||||
|              | ||||
|             if(cardPricing[data].value > cardPricing[data].min){ | ||||
|                 cardPricing[data].value --; | ||||
|                 cardPricing[data].value = Number(cardPricing[data].value) - cardPricing[data].interval; | ||||
|             } | ||||
|             _fetchPricing(); | ||||
|         }); | ||||
|         $('.fa-plus-circle.right').click(function(event){ | ||||
|             var data = $(this).data('plus'); | ||||
|             if(cardPricing[data].value < cardPricing[data].max){ | ||||
|                 cardPricing[data].value = cardPricing[data].value + cardPricing[data].interval; | ||||
|                 cardPricing[data].value = Number(cardPricing[data].value) + cardPricing[data].interval; | ||||
|             } | ||||
|             _fetchPricing(); | ||||
|         }); | ||||
| 
 | ||||
|         $('.input-price').change(function(){ | ||||
|             var data = $(this).attr("name"); | ||||
|             cardPricing[data].value = $('input[name='+data+']').val(); | ||||
|             _fetchPricing(); | ||||
|         }); | ||||
|     } | ||||
|     function _fetchPricing(){ | ||||
|         Object.keys(cardPricing).map(function(element){ | ||||
|             $('#'+cardPricing[element].id).text(cardPricing[element].value); | ||||
|             //$('#'+cardPricing[element].id).val(cardPricing[element].value);
 | ||||
|             $('input[name='+element+']').val(cardPricing[element].value); | ||||
|         }); | ||||
|         _calcPricing(); | ||||
|  | @ -116,6 +122,7 @@ | |||
| 
 | ||||
|     function _calcPricing(){ | ||||
|         var total = (cardPricing['cpu'].value * 5) + (2* cardPricing['ram'].value) + (0.6* cardPricing['storage'].value)  | ||||
|         console.log(total); | ||||
|         total = parseFloat(total.toFixed(2)); | ||||
| 
 | ||||
|         $("#total").text(total); | ||||
|  |  | |||
|  | @ -123,17 +123,20 @@ | |||
|                   </div> | ||||
|                   <div class="description"> | ||||
|                      <i class="fa fa-minus-circle left" data-minus="cpu" aria-hidden="true"></i> | ||||
|                      <span id="coreValue">1</span><span> Core</span>  | ||||
|                      <input class="input-price" type="number"  min="1" max="42" id="coreValue" name="cpu"> | ||||
|                      <span> Core</span>  | ||||
|                      <i class="fa fa-plus-circle right" data-plus="cpu"  aria-hidden="true"></i> | ||||
|                   </div> | ||||
|                   <div class="description"> | ||||
|                    <i class="fa fa-minus-circle left" data-minus="ram" aria-hidden="true"></i> | ||||
|                     <span id="ramValue">2</span><span> GB RAM</span> | ||||
|                     <input id="ramValue" class="input-price" type="number"  min="2" max="200"  name="ram"> | ||||
|                     <span> GB RAM</span> | ||||
|                     <i class="fa fa-plus-circle right" data-plus="ram"  aria-hidden="true"></i> | ||||
|                   </div> | ||||
|                   <div class="description"> | ||||
|                   	<i class="fa fa-minus-circle left" data-minus="storage" aria-hidden="true"></i> | ||||
|                     <span id="storageValue">15</span><span>{% trans "GB Storage (SSD)" %}</span> | ||||
|                     <input id="storageValue" class="input-price" type="number"  min="10" max="500" step="10" name="storage"> | ||||
|                     <span>{% trans "GB Storage (SSD)" %}</span> | ||||
|                      <i class="fa fa-plus-circle right" data-plus="storage"  aria-hidden="true"></i> | ||||
|                   </div> | ||||
|                   | ||||
|  | @ -145,9 +148,6 @@ | |||
|                         {% endfor %} | ||||
|                   	</select> | ||||
|                   </div> | ||||
|                   <input type="hidden" name="cpu"> | ||||
|                   <input type="hidden" name="ram"> | ||||
|                   <input type="hidden" name="storage"> | ||||
|                   <input type="hidden" name="total"> | ||||
|                    <!--<div class="description check-ip"> | ||||
|                   	<input type="checkbox" name="ipv6"> Ipv6 Only<br> | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue