@DERUINO
frontend Разработчик

Почему ajax не срабатывает второй раз?

Здравствуйте, в ajax я полный ноль, кое как сумел понять, как обновлять контент без перезагрузки, но вопрос в том, что обновляется нужный мне контент всего 1 раз, ладно бы это было со всем, но одна форма добавляет записи без перезагрузки сколько угодно раз, а вот другая при втором нажатии перезагружает страницу.

говнокод:

index.php

<table class="show_table" width="100%">
		<tbody>
			<tr>
				<th>Имя преподавателя</th>
				<th>Специальность</th>
				<th>Класс</th>
				<th>Время взятия ключа</th>
				<th>Время сдачи ключа</th>
				<th class="th_delete"></th>
			</tr>

	<?php
		$sql2 = $link->prepare("SELECT * FROM `logs` ORDER BY `id` DESC LIMIT 500");
		$sql2->execute();
		if($sql2->rowCount() > 0) {
  		while($table = $sql2->fetch(PDO::FETCH_BOTH)) {
  			if ($table['date'] == date('d-m-y')) {
  				if ($table['teacher'] == 1) {
	  				echo '<tr class="find teacher">';
	  			} else if ($table['teacher'] == 0) {
	  				echo '<tr class="find student">';
	  			}
	  			  echo '<td class="td_name">'.$table['name'].'</td>
	  			  		<td class="td_spec">'.$table['spec'].'</td>
	  					<td>'.$table['class'].'</td>
	  					<td><span class="days">'.$table['getin'].'</span> '.$table['getinmin'].'</td>';
	  					if ($table['getout'] == NULL) {
	  						echo '<td class="td_getout"><form id="getout"><input type="text" name="getout" value="'.$table['id'].'"><button type="submit" class="getout">Сдать ключи</button></form></td>';
	  					} else {
	  						echo '<td><span class="days">'.$table['getout'].'</span> '.$table['getoutmin'].'</td>';
	  					}
	  			echo '<td class="td_delete">
	  					<form id="delete">
		  					<input name="delete" type="text" value="'.$table['id'].'">
	  						<button class="delete" type="submit">
	  							Удалить
	  						</button>
	  					</form>
  					  </td>
	  				</tr>';
  			}
  		}
  	}
	?>

  </tbody>
</table>

$("#form, #form2, #delete").submit(function (e) {
     e.preventDefault();
      	var form_data = $(this).serialize();
      	$.ajax({
          type: "POST",
          url: "papa/ajax.php",
          cache: false,
          data: form_data,
          success: function (show) {
          		$('.good').fadeIn(300);
          		$('.show_table').html(show);
          		setTimeout(function () {
	                $('.alertblock').fadeOut(300);
                }, 1000);
          },
          error: function() {
          		$('.bad').fadeIn(300);
          		setTimeout(function () {
	                $('.alertblock').fadeOut(300);
                }, 1000);
          }
      	});
      	return false;
});


ajax.php

include('config.php');
include('update.php');

$sql2 = $link->prepare("SELECT * FROM `logs` ORDER BY `id` DESC LIMIT 500");
$sql2->execute();
echo '<tr>
	  				<th>Имя преподавателя</th>
	  				<th>Специальность</th>
	  				<th>Класс</th>
	  				<th>Время взятия ключа</th>
	  				<th>Время сдачи ключа</th>
	  				<th class="th_delete"></th>
	  			</tr>';
if($sql2->rowCount() > 0) {
	while($table = $sql2->fetch(PDO::FETCH_BOTH)) {
		if ($table['date'] == date('d-m-y')) {
			if ($table['teacher'] == 1) {
				echo '<tr class="find teacher">';
			} else if ($table['teacher'] == 0) {
				echo '<tr class="find student">';
			}
			  echo '<td class="td_name">'.$table['name'].'</td>
			  		<td class="td_spec">'.$table['spec'].'</td>
					<td>'.$table['class'].'</td>
					<td><span class="days">'.$table['getin'].'</span> '.$table['getinmin'].'</td>';
					if ($table['getout'] == NULL) {
						echo '<td class="td_getout"><form id="getout"><input type="text" name="getout" value="'.$table['id'].'"><button type="submit" class="getout">Сдать ключи</button></form></td>';
					} else {
						echo '<td><span class="days">'.$table['getout'].'</span> '.$table['getoutmin'].'</td>';
					}
			echo '<td class="td_delete">
					<form id="delete">
  					<input name="delete" type="text" value="'.$table['id'].'">
						<button class="delete" type="submit">
							Удалить
						</button>
					</form>
				  </td>
				</tr>';
		}
	}
}


update.php

include('config.php');

$name = $_POST['name'];
$student_name = $_POST['student_name'];
$class = $_POST['class'];
$delete = $_POST['delete'];
$getout = $_POST['getout'];

$date = date("d-m-y");
$datemin = date("H:i");

list($add_name, $add_spec) = explode(" | ", $name);
list($add_name_student, $add_spec_student) = explode(" | ", $student_name);

if (isset($name)) {
	if ($name == 'empty' || $class == 'empty') {
		die(header("HTTP/1.0 404 Not Found"));
	} else {
		$table_teacher_sql = $link->prepare("INSERT INTO `logs` SET `name` = :name, `class` = :class, `getin` = :getin, `getinmin` = :getinmin, `date` = :datelogs, `teacher` = :teacher, `spec` = :spec");
		$table_teacher_sql->execute(array('name' => $add_name, 'class' => $class, 'getin' => $date, 'getinmin' => $datemin, 'datelogs' => $date, 'teacher' => 1, 'spec' => $add_spec));
	}
}

if (isset($student_name)) {
	if ($student_name == 'empty' || $class == 'empty') {
		die(header("HTTP/1.0 404 Not Found"));
	} else {
		$table_student_sql = $link->prepare("INSERT INTO `logs` SET `name` = :name, `class` = :class, `getin` = :getin, `getinmin` = :getinmin, `date` = :datelogs, `teacher` = :teacher, `spec` = :spec");
		$table_student_sql->execute(array('name' => $add_name_student, 'class' => $class, 'getin' => $date, 'getinmin' => $datemin, 'datelogs' => $date, 'teacher' => 0, 'spec' => $add_spec_student));
	}
}

if (isset($delete)) {
	$delete_sql = $link->prepare("DELETE FROM `logs` WHERE `id` = :del");
	$delete_sql->execute(array('del' => $delete));
}

if (isset($getout)) {
	$getout_sql = $link->prepare("UPDATE `logs` SET `getout` = :getout, `getoutmin` = :getoutmin WHERE `id` = :id");
	$getout_sql->execute(array('getout' => $date, 'getoutmin' => $datemin, 'id' => $getout));
}


Добавление новой записи происходит нормально, без перезагрузки, сколько угодно раз, но вот удаление этой записи работает без перезагрузки только 1 раз, и когда я хочу удалить следующую, он перезагружает страницу и вставляет в запросе id удаленной строчки и ничего не удаляет.
  • Вопрос задан
  • 92 просмотра
Решения вопроса 1
YavaDev
@YavaDev
Возможно проблема в том, что ваш обработчик cобытий просто не работает с новыми элементами, который были только, что добавленны на страницу.
Попробуйте заменить эту строку в js коде:
$("#form, #form2, #delete").submit(function (e) {
на
$(document).on("submit", "#form, #form2, #delete", function (e) {
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы