Я работаю над небольшим самостоятельным проектом, и я не могу понять свою проблему. Если кто-то может дать отзыв, было бы здорово. Заранее спасибо.
Итак, у меня есть php файл index.php, и в этом файле у меня есть div с id main-container. В настоящее время в main-container есть два деления. Первый div содержит начальный вид, который вы видите при загрузке страницы, а второй div - второй, когда мы обновляем его с помощью jquery ajax.
Первый элемент div с идентификатором startview содержит элемент кнопки с идентификатором loginbutton.
Как только мы щелкнем по этому элементу кнопки, мы должны отправить запрос контроллеру, чтобы скрыть элемент divс идентификатором startview и показать div с идентификатором secondview.
Вот мой файл index.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script>
$(document).ready(function() {
$("#loginbutton").click(function(){
$.post("controller.php",
{
page: "StartView",
command: "Login"
},
function(data){
$("#main-container").html(data);
});
});
});
</script>
</head>
<body >
<div class="container-fluid" style="width: 75%; background-color: #325d81" id="main-container">
<h1>Main-Container</h1>
<!-- initital view-->
<div class="container-fluid" style="background-color: yellow;" id='startview'>
<h1>Starting View/Page</h1>
<button type='button' id='loginbutton'>Click to login.</button>
</div>
<!--View after loggin in. -->
<div class="container-fluid" style="display: none; background-color: orange; width: 75%;" id="secondview">
<br>
<h2>Second View/Page</h2>
</div>
<?php //require('views/startview.php');?>
<!--View after clicking login button. -->
<?php// require('views/secondview.php');?> <!--Not Working!??!?!?!? -->
</div>
</body>
</html>
, а вот мой файл controller.php
<?php
$page = $_POST['page'];
$command = $_POST['command'];
// When commands come from StartView
if ($page == 'StartView') {
switch($command) {
case 'Login':
//Alert the user we recieved the login request
echo "<script>alert('Received your login request.');</script>";
// Display MainPage
echo "<script>$('#startview').hide(); $('#secondview').show();</script>";
exit();
default:
exit();
}
}
?>
В основном моя проблема заключается в том, что когда пользователь нажимает кнопку входа в системувторое мнение не показывает. и StartView должен быть скрыт.