点击提交按钮后,在同一页面显示值时获得总计

时间:2017-05-14 07:47:26

标签: javascript php jquery html

我点击提交按钮后在同一页面中显示它的显示值,一切正常 但是每当我点击提交按钮时,我需要获得总值。 请任何人帮助我

这是我的完整代码。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="custom.css" type="text/css">

<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Add Sales</title>

		<script type="text/javascript">

$(document).ready(function() {

$("#stk").change(function(){

document.getElementById('total').value=document.getElementById('pric').value * document.getElementById('stk').value;
});	

	});

	function add_values(){
 
         if(document.getElementById('edit_guid').value==""){
     if( document.getElementById('stk').value!="" &&  document.getElementById('total').value!="" ){
     
                    if(document.getElementById('stk').value!=0){
                   
    sell=document.getElementById('pric').value;
    disc=document.getElementById('stk').value;
    total=document.getElementById('total').value;
    item=document.getElementById('guid').value;
  
    roll=parseInt(document.getElementById('roll_no').value);
 
    $('<tr id='+item+'><td><lable id='+item+'roll >'+roll+'</label></td><td><input type=text  readonly="readonly" value='+sell+'></td><td><input type=text  readonly="readonly" value='+disc+' ></td><td><input type=text  readonly="readonly" value='+total+'> </td></tr>').fadeIn("slow").appendTo('#item_copy_final');
    document.getElementById('stk').value="";
    document.getElementById('pric').value="";
    
    document.getElementById('roll_no').value=roll+1;
    document.getElementById('total').value="";
   
    document.getElementById('guid').value="";
    
}
}else{
     alert('Please Select An Item');
    }
    }
 
    }
        </script>
        
<body>

				<form name="form1" method="post" id="form1" action="">
                                  
                  <input type="hidden" id="roll_no" value="1" >   	
                 <div align="center">
                  <input type="hidden" id="guid">
                  <input type="hidden" id="edit_guid">
                        
                  <table class="form" >
                      
					<tr>
                          <td>price</td>
						  <td></td> 
                          <td>stk</td>
                          <td>totall</td>
                      </tr>
			<tr>
			<td>

			<td><input type='text' class='form-control' id="pric" name="pric"></td>
			<td><input type='text' class='form-control' id="stk" name="stk"></td>
			<td><input type='text' class='form-control' id="total" name="total1"></td>
			<td><input type="button" onclick="add_values()"  id="add_new_code" value="submit" class="round"></div></form></td></tr>
                  </table>
                          
                       <div style="overflow:auto ;max-height:300px;  ">
                          <table class="form" id="item_copy_final" style="margin-left:45px ">
                    
                    </table>
                   </div>
                     </div>
         <div class="mytable_row ">
		 <form>
		 <div align="center">
		 <table>
		 <td>grand totall</td>
		 <td><input type="text" id="grand_tot" name="grand_tot"></td>
		 </table>
		 </div>
		 </form>
  
</body>
</html>

2 个答案:

答案 0 :(得分:0)

我尝试但是,它在GrandTotal中采用当前文本值并且直接它....

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="custom.css" type="text/css">

<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Add Sales</title>

		<script type="text/javascript">

$(document).ready(function() {

$("#stk").change(function(){

document.getElementById('total').value=document.getElementById('pric').value * document.getElementById('stk').value;
});	

	});

	function add_values(){
 
         if(document.getElementById('edit_guid').value==""){
     if( document.getElementById('stk').value!="" &&  document.getElementById('total').value!="" ){
     
                    if(document.getElementById('stk').value!=0){
    
         var current_TOTAL = document.getElementById('total').value=document.getElementById('pric').value * document.getElementById('stk').value;
   
    var sell=document.getElementById('pric').value;
    var disc=document.getElementById('stk').value;
    var total=document.getElementById('total').value;
    var item=document.getElementById('guid').value;
    var grand_total =document.getElementById('grand_tot').value;
    var full_total = 0;
    full_total = 0;
    var full_total = document.getElementById('total').value;
   
    roll=parseInt(document.getElementById('roll_no').value);
 
    $('<tr id='+item+'><td><lable id='+item+'roll >'+roll+'</label></td><td><input type=text  readonly="readonly" value='+sell+'></td><td><input type=text  readonly="readonly" value='+disc+' ></td><td><input type=text  readonly="readonly" value='+total+'> </td></tr>').fadeIn("slow").appendTo('#item_copy_final');
    document.getElementById('stk').value="";
    document.getElementById('pric').value="";
    
    document.getElementById('roll_no').value=roll+1;
    document.getElementById('total').value="";
   
    document.getElementById('guid').value="";
    
    document.getElementById('grand_tot').value=full_total;
    
}
}else{
     alert('Please Select An Item');
    }
    }
 
    }
        </script>
        
<body>

				<form name="form1" method="post" id="form1" action="">
                                  
                  <input type="hidden" id="roll_no" value="1" >   	
                 <div align="center">
                  <input type="hidden" id="guid">
                  <input type="hidden" id="edit_guid">
                        
                  <table class="form" >
                      
					<tr>
                          <td>price</td>
						  <td></td> 
                          <td>stk</td>
                          <td>totall</td>
                      </tr>
			<tr>
			<td>

			<td><input type='text' class='form-control' id="pric" name="pric"></td>
			<td><input type='text' class='form-control' id="stk" name="stk"></td>
			<td><input type='text' class='form-control' id="total" name="total1"></td>
			<td><input type="button" onclick="add_values()"  id="add_new_code" value="submit" class="round"></div></form></td></tr>
                  </table>
                          
                       <div style="overflow:auto ;max-height:300px;  ">
                          <table class="form" id="item_copy_final" style="margin-left:45px ">
                    
                    </table>
                   </div>
                     </div>
         <div class="mytable_row ">
		 <form>
		 <div align="center">
		 <table>
		 <td>grand totall</td>
		 <td><input type="text" id="grand_tot" name="grand_tot"></td>
		 </table>
		 </div>
		 </form>
  
</body>
</html>

答案 1 :(得分:0)

最后我得到了答案,这可能对某人有所帮助。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="custom.css" type="text/css">

<html lang="en">
<head>
	<meta charset="utf-8">
	<title>Add Sales</title>

		<script type="text/javascript">

$(document).ready(function() {

//$("#stk").change(function(){

//document.getElementById('total').value=document.getElementById('pric').value * document.getElementById('stk').value;
//});	

$("#pric,#stk").keyup(function () {
    $('#total').val($('#pric').val() * $('#stk').val());
});

	});

	function add_values(){
 
         if(document.getElementById('edit_guid').value==""){
     if( document.getElementById('stk').value!="" &&  document.getElementById('total').value!="" ){
     
                    if(document.getElementById('stk').value!=0){
                   
    sell=document.getElementById('pric').value;
    disc=document.getElementById('stk').value;
    total=document.getElementById('total').value;
    item=document.getElementById('guid').value;
	//item=document.getElementById('guid').value;
    roll=parseInt(document.getElementById('roll_no').value);
	
 
    $('<tr id='+item+'><td><lable id='+item+'roll >'+roll+'</label></td><td><input type=text  readonly="readonly" value='+sell+'></td><td><input type=text  readonly="readonly" value='+disc+' ></td><td><input type=text  readonly="readonly" class="submited-total" value='+total+'> </td></tr>').fadeIn("slow").appendTo('#item_copy_final');
    document.getElementById('stk').value="";
    document.getElementById('pric').value="";
    
    document.getElementById('roll_no').value=roll+1;
    document.getElementById('total').value="";
   //document.getElementById('roll_no').value="";
    document.getElementById('guid').value="";
	
	submitedTotal = 0;
	$('.submited-total').each(function(){
		submitedTotal = this.value;	
	});
	if(document.getElementById('grand_tot').value==""){
        document.getElementById('grand_tot').value=submitedTotal;
    }else{
    submitedTotal =parseFloat(document.getElementById('grand_tot').value)+ parseFloat(submitedTotal);
    }
    $('#grand_tot').val(submitedTotal);
}
}else{
     alert('Please Select An Item');
    }
    }
 
    }
        </script>
        
<body>

				<form name="form1" method="post" id="form1" action="">
                                  
                  <input type="hidden" id="roll_no" value="1" >   	
                 <div align="center">
                  <input type="hidden" id="guid">
                  <input type="hidden" id="edit_guid">
                        
                  <table class="form" >
                      
					<tr>
                          <td>price</td>
						  <td></td> 
                          <td>stk</td>
                          <td>totall</td>
                      </tr>
			<tr>
			<td>

			<td><input type='text' class='form-control' id="pric" name="pric"></td>
			<td><input type='text' class='form-control' id="stk" name="stk"></td>
			<td><input type='text' class='form-control' id="total" name="total1"></td>
			<td><input type="button" onclick="add_values()"  id="add_new_code" value="submit" class="round"></div></form></td></tr>
                  </table>
                          
                       <div style="overflow:auto ;max-height:300px;  ">
                          <table class="form" id="item_copy_final" style="margin-left:45px ">
                    
                    </table>
                   </div>
                     </div>
         <div class="mytable_row ">
		 <form>
		 <div align="center">
		 <table>
		 <td>grand totall</td>
		 <td><input type="text" id="grand_tot" name="grand_tot"></td>
		 </table>
		 </div>
		 </form>
  
</body>
</html>

相关问题