Журнал учёта навыков на php
Делаю журнал учёта собственных навыков программирования, на php.
Идея такая: в main/index.php можно добавить skill с названием, которое вводим, по нажатию кнопки ADD SKILL. В принципе кнопка работает как надо, создаётся новый skill в таблице skills из базы данных General_project, а так же выводится div с названием скилла.
В таблице skills два поля-id и name. Тип таблицы-InnoDB-создаётся red bean-ом.
Но если страницу обновить, даже не нажимая кнопки, каждый раз будет добавляться по 1 div-у с последним введённым названием. Это мне, естественно, не нужно. И не знаю как это убрать.
Например, при пустой таблице, добавляем скилл с названием Javascript. Он добавляется в таблицу. При обновлении страницы в таблице появляется идентичный скилл, и соответственно, выводится div.
Если что, в проекте есть и другие файлы, но они никак не могут повлиять на работу данного кода. Также я использовал фреймворк Red Bean php.
В папке, доступной по ссылке лежит весь нужный код.
Буду благодарен за помощь.
Файл index.php:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js">
</script>
<link href="https://fonts.googleapis.com/css?
family=Lato:700i|Song+Myung" rel="stylesheet">
<?php
require "db.php";
require_once "functions/functions.php";
$blocks = getBlocks(3, $id);//по сути нам на данной странице оба
аргумента не нужны, написано чтобы не было ошибки, нужно для другого
if(isset($_POST["add_skill_btn"])) {
if(trim($_POST["skill_name"]) == '') {
echo "Wrong skill";
} else {
$skill_name = htmlspecialchars($_POST["skill_name"]);
$skill = R::dispense('skills');//фреймворк Red Bean php создаёт таблицу
$skill->name = $_POST["skill_name"];
R::store($skill);//фреймворк Red Bean php сохраняет таблицу
}
}
?>
<script>
$(document).ready(function () {
$('#first').on('click', function() {
$('#goals').hide();
$('#skills').toggle(200);
});
$('#second').on('click', function() {
$('#skills').hide();
$('#goals').toggle(200);
});
});
</script>
</head>
<body>
<div id="aside">
<div id="first">
<h2 class="titles">Skills</h2>
</div>
<div id="second">
<h2 class="titles">Goals</h2>
</div>
</div>
<div id="skills">
<form method="post" name="skill_form">
<button type="submit" id="add_skill_btn"
name="add_skill_btn">ADDSKILL</button>
<input type="text" id="add_skill_input" name="skill_name" placeholder="
New skill?">
</form>
<div id="kill_zone"><!--рабочая область-где все блоки со скиллами-->
<?php
for ($i = 0; $i < count($blocks); $i++) {
echo '<a href="#">
<div class="skill_block">
<h2>'.$blocks[$i]["name"].'</h2>
</div>
</a>';
}
?>
</div>
</div>
<div id="goals">
<div><h2>Here is another text</h2></div>
</div>
</body>
</html>
Файл style.css:
body {
margin: 0px;
background-color: #002338;
}
a {
text-decoration: none;
}
#aside{
height: 729px;
width: 15%;
float: left;
background-color: rgba(18,18,18,0.92);
}
#first {
text-align: center;
box-shadow: 0px 2px 16px 17px rgba(74,51,50,1);
margin: 40px auto;
height: 120px;
width: 150px;
background-color: #57110a;
}
#second {
text-align: center;
box-shadow: 0px 2px 16px 17px rgba(96,99,24,1);
margin: 100px auto;
height: 120px;
width: 150px;
background-color: #57531c;
}
.titles {
padding-top: 45px;
font-family: 'Ubuntu', sans-serif;
}
#skills {
width:85%;
height: 729px;
float: right;
background-color: #002338;
display: none;
}
#goals {
width:85%;
height: 729px;
float: right;
background-color: #002338;
display: none;
}
#add_skill_btn {
margin: 15px;
float: right;
width: 75px;
height: 65px;
border: 1px solid #868686;
border-radius: 5px;
background-color: #02acc8;
box-shadow: inset 0px 0px 27px 10px rgba(50, 50, 50, 0.59);
font-weight: 700;
font-size: 1.2em;
color: #303231;
}
#add_skill_input {
margin: 20px -5px;
float: right;
height: 50px;
width: 150px;
border: 1px solid #868686;
border-radius: 5px;
background-color: #02acc8;
box-shadow: inset 0px 0px 27px 10px rgba(50, 50, 50, 0.59);
font-size: 1.3em;
font-weight: 800;
letter-spacing: 2px;
}
input::-webkit-input-placeholder {
color: #4f5150;
}
#kill_zone {
width: 85%;
margin-left: 5%;
margin-right: 5%;
height: auto;
margin-top: 150px;
}
.skill_block {
width: 216px;
height: 170px;
background-color: bisque;
border: 10px solid #ADA7A7;
border-radius: 15px;
box-shadow: inset 0px 0px 25px 9px #ADA7A7;
text-align: center;
box-sizing: border-box;
float: left;
margin-left: 90px;
margin-top: 50px;
}
.skill_block h2 {
font-weight: normal;
font-size: 2em;
font-family: 'Song Myung', serif;
color: rgba(18,18,18,0.92);
margin-top: 50px;
}
Файл functions.php :
<?php
require_once "connect.php";
function getBlocks ($limit, $id) {
global $mysqli;
connectDB();
$result = $mysqli->query("SELECT * FROM `skills` ORDER BY `id` ASC");
closeDB();
if(!$id)
return resultToArray($result);
else
return $result->fetch_assoc();
}
function resultToArray ($result) {
$array = array();
while (($row = $result->fetch_assoc()) != false)
$array[] = $row;
return $array;
}
Файл db.php:
<?php
require "libs/rb-mysql.php";
R::setup('mysql:host=localhost;dbname=General_project','root', '' );
Файл connect.php:
<?php
$mysqli = false;
function connectDB () {
global $mysqli;
$mysqli = new mysqli("localhost", "root","", "General_project");
$mysqli->query("SET NAMES 'UTF-8'");
}
function closeDB () {
global $mysqli;
$mysqli->close();
}
-
13:03
-
12:54
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
-
21:25
-
07:04
-
07:46
-
21:56
Перевод документов на английский язык: Важность и ключевые аспекты
-
20:52
-
11:43
-
07:54
Какие существуют виды рекламных бордов и как выбрать подходящий?
- Почему SERVER_ADDR имеет не тот IP 47526 visits
- Как заменить $_SERVER[REMOTE_ADDR] на IP клиента в PHP за двумя Nginx? 30479 visits
- Хочу вывести несколько строк из массива в один div, выводит только много undefined; подскажите, что делать? 23599 visits
- Как через css изменить цвет png изображения? 10335 visits
- Blob video url download 9945 visits
- Php curl запрос через прокси с авторизацией 9198 visits
- Работа с captcha vk api 8078 visits
© "hostciti.net" 01.11.2024 | 02:35