Возврат значения из php с помощью ajax

21 августа 2021, 16:10

В файле index.php считываю значения с полей input summa_1 и summa_2, с помощью скрипта calc.php обрабатываю их и обратно на страницу index.php нужно вывести в тег

значение переменной $summa_3. Проблема в том, что не знаю как сделать это с помощью ajax.

<!DOCTYPE html> 
<html lang="rus"> 
<head> 
	<meta charset="utf-8"> 
	<link rel="stylesheet" type="text/css" href="style.css"> 
	<title>B</title> 
	<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> 
	<link rel="stylesheet" href="https://code.jquery.com/resources/demos/style.css"> 
  	<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
    integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" 
    crossorigin="anonymous"></script> 
	<script 
  src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" 
  integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" 
  crossorigin="anonymous"></script> 
  	<script type="text/javascript" src="datepicker-ru.js" defer></script> 
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
		<script> 
	$( document ).ready(function(){ 
	  $( "knopka" ).click(function(){ 
	    $.ajax({ 
	      method: "POST", // метод HTTP, используемый для запроса 
	      url: "calc.php", // строка, содержащая URL адрес, на который отправляется запрос 
	      data: { // данные, которые будут отправлены на сервер 
	        summa_1: "summa_1", 
	        summa_2: "summa_2" 
	      }, 
	      success: [function ( msg ) {  
	        $( "p" ).text; 
	      }], 
	      } 
	    }) 
	  }); 
	}); 
		</script> 
		 
</head> 
<body> 
	<div id="wrapper"> 
			<table id="calc"> 
				<form name="calc" method="post" action="calc.php"> 
					<tr> 
						<td id="">Сумма вклада</td> 
						<td id=""><input id="summa_1" name="summa_1" type="text" min="1000" max="3000000" step="1" required value=""></td> 
						<td><input id="begunok_1" type="range" min="1000" max="3000000" step="1" value="1500000" oninput="fun1()"> 
						<br> 
						<label id="metka_begun">1000</label> <label id="metka_begun2">100000</label> 
						</td> 
					</tr> 
<tr> 
						<td id="">Сумма пополнения вклада 
						</td> 
 
						<td id=""><input id="summa_2" name="summa_2" type="text"> 
						</td> 
 
						<td><input  id="begunok_2" type="range" min="1000" max="3000000" step="1" value="1500000" oninput="fun2()"> 
						<br> 
						<label id="metka_begun">1 тыс. руб.</label> <label id="metka_begun2">10000</label> 
						</td> 
					</tr> 
					<tr> 
						<td colspan="3"><input id="knopka" type="submit" value="Рассчитать">&nbsp;Результат:<p><?php echo $summa_3; ?></p></td> 
					</tr>	 
				</form> 
			</table> 
    </div> 
</body> 
</html>

<?php 
if($_SERVER['REQUEST_METHOD'] == 'POST') { 
   $summa_1 = $_POST['summa_1'];  
   $summa_2 = $_POST['summa_2']; 
   $percent = 0.1; 
   $daysy = 365;  
   $daysn = 10; 
   $summa_3 = $summa_1-1+($summa_2)*$daysn*($percent/$daysy); 
   echo round ($summa_3, 2); 
} 
?>

							function fun1() { 
                                 var rng2=document.getElementById('begunok_1');  
                                      var summa_1=document.getElementById('summa_1');  
                                      summa_1.value=rng2.value; 
                                      } 
							function fun2() { 
                                 var rng=document.getElementById('begunok_2');  
                                      var summa_2=document.getElementById('summa_2');  
                                      summa_2.value=rng.value; 
                                      }

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Как Symfony узнает, какой ObjectManager нужно создать

Вопрос возможно странный, но все жеИмеем конфиг из документации Symfony 4:

142

Java

Нужно после символа убрать остальные знаки

есть вводимое число ll+lll; нужно чтобы после + все числа удалены были, как это сделать, числа могут быть не только ll+lll, могуть быть l+ll,lv+vl и тпСуть...

174

Java

LDAP + Spring: как авторизоваться правильно?

В Spring есть реализация авторизация по LDAPВ нашем конкретном случае, это происходит через ActiveDirectoryLdapAuthenticationProvider

Java

Как переконфигурить OAuth2Config

Есть конфигурация

171