Добрый день! Я ajax практически не знаю, просто копался в интернете за этот день. В итоге накатал код который поидее должен был добавлять запись без перезагрузки и тут выводить ее в таблице. Однако, что-то ничего не происходит при нажатии кнопки "добавить". Кто опытным взглядом может определить в чем ошибка?
Вообщем имеется таблица article с полями:
article_id integer not null auto_increment primary key;
article_title varchar(300);
И имеются два файла:
- index.php в котором есть вывод данных из таблицы и скрипт ajax по поводу передачи данных на вставку.
- addArticle.php - файл в котором идет вставка записи;
Код файла addArticle.php:
<?php
$article_title = $_POST['article_title'];
$connect = new mysqli("localhost", "root", "", "managerarticle");
if($connect->query("insert into article (article_title) values ('$article_title')"))
echo "OK";
else
echo "ОШИБКА В ЗАПРОСЕ!";
?>
Код основного файла index.php:
<?php
// mysqli(хост, пользователь, пароль_пользователя, название_БД)
$connect = new mysqli("localhost", "root", "", "managerarticle");
$connect->query("SET NAMES 'utf8'");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Сайтик</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<link href="layout/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js">
$(document).ready( function()
{
// обрабатываем событие нажатия на кнопку "Добавить новый товар"
$('input[name=addArticle]').click(
function ()
{
var article_title = $('input[name=article_title_new]').val();
// отправляем AJAX запрос
$.ajax(
{
type: "POST",
url: "http://localhost/MyAjax/addArticle.php",
data: "article_title=" + article_title,
success: function(response)
{
if(response == "OK")
{
alert("Товар " + article_title + " добавлен!");
location.reload();
}
else
alert("Ошибка в запросе! Сервер вернул вот что: " + response);
}
}
);
}
);
});
</script>
</head>
<body>
<div id="wrap">
<div id="header">
<div id="logo">Редактор статей по технологии Ajax</div>
<div id="nav">
<ul>
<li class="active"><a href="index.php">Главная страница</a></li>
</ul>
</div>
<div id="header-pic"> <img src="info/header-pics/index-header.jpg" alt="" /> </div>
</div>
<div id="content-wrap">
<div id="content">
<h1> Редактор товаров</h1>
<div>
Добавить товар:<br>
<input type="text" name="article_title_new" placeholder="Название товара">
<input type="button" name="addArticle" value="Добавить новый товар"><br>
</div><br>
<table border="0" cellspacing="0" cellpadding="0">
<caption>
Товары
</caption>
<tr>
<th >Номер товара</th>
<th>Название</th>
<th>Редактирование</th>
</tr>
<?php
// достаем из базы данных ID и заголовок всех статей
$result = $connect->query("select article_id, article_title from article");
//определяем количество полученных записей
$colResult = $result->num_rows;
if($colResult > 0)
{
for($i = 0; $i < $colResult; $i++)
{
$row = $result->fetch_object();
echo"<tr>";
echo "<td>".$row->article_id."</td>";
echo "<td>".$row->article_title."</td>";
echo "<td><center><input type='checkbox' name='delete_button[]' value='".$row->article_id."'></center></td>";
echo "</tr>";
}
}
?>
</table>
</div>
</body>
</html>
И вообщем этот код не срабатывает. Почему не добавляется запись ни в таблицу, ни соответственно не выводится в теге таблицы. В чем может быть ошибка?
success(response){ }
?