0

При нажатии на ссылку "Добавить клиента" в файле index1.php открывается всплывающее окно с формой, в форме есть кнопка "Добавить". Я прописал на баттон код обновления:

$('.submit').click(function() {
  setTimeout(function() {
    window.location.reload();
  }, 2000)}
);

Но при нажатии на баттон(Добавить) всплывающее окно исчезает и обновляет данные,а как сделать чтобы окно оставалось? Но при этом данные обновлялись. Помогите пожалуйста.

index1.php :

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Рекламное агенство</title>       
      <style type="text/css">
      <? include "css/style.css" ?>    
      <script src="//vk.com/js/api/openapi.js?122" type="text/javascript"></script>
      </style>

<!-- Отвечает за всплывающее окно -->
<!-- Magnific Popup core CSS file -->
<link rel="stylesheet" href="Magnific/dist/magnific-popup.css">

<!-- jQuery 1.7.2+ or Zepto.js 1.0+ -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<!-- Magnific Popup core JS file -->
<script src="Magnific/dist/jquery.magnific-popup.js"></script>
  <!-- Отвечает за всплывающее окно -->

    <!-- Отвечает за алерт -->
<!-- include the script -->
<script src="alertifyjs/alertify.min.js"></script>

<!-- include the style -->
<link rel="stylesheet" href="alertifyjs/css/alertify.min.css" />
<!-- include a theme -->
<link rel="stylesheet" href="alertifyjs/css/themes/default.min.css" />
     <!-- Отвечает за алерт -->

</head>
<body> 

<!--  всплывающая форма  добавления клиента -->
<div class="hidden">
<form  id="form">

клиент<br/>
<input type="text" name="klient"  placeholder="ООО ТехноСтрой" /><br/>
ОП_форма <br/>
<textarea name="op_forma" ></textarea> <br/> <!-- cols="10" rows="10" -->
Наимен <br/>
<input type="text" name="naimen"  /><br/><br/>
отрасль <br/>
<input type="text" name="otrasl"  /><br/><br/>
telefon <br/>
<input type="text" name="telefon"  /><br/><br/>
email <br/>
<input type="text" name="email"  /><br/><br/>
Контактное лицо <br/>
<input type="text" name="kont_lico"  /><br/><br/>
Должность <br/>
<input type="text" name="dolznost"  /><br/>

<input type="hidden" name="date" value="<?php echo date ('Y-m-d');?>" />
<input type="hidden" name="time" value="<?php echo date ('H:i:s');?>" />
<br/>
Дата выполнения <br/>
<input type="date" name="date1"  id="davaToday"  class="tcal"   value="" />
<br/>
<br/>



<input type="button" name="reset_form" value="Очистить форму" onclick="this.form.reset();">
<input type="submit" class="submit" id="send"  value="Добавить1" />
</form>
</div>
<!--  всплывающая форма  добавления клиента -->
    <!-- header -->
    <header>
    <div class="wrapper">
       <a href="index.html">
       </a>
        <nav > 
        <ul id="navbar">
        <li><a href="#">Клиенты</a></li>
        <li><a href="#">Photos</a></li>
        <li><a href="#">Developers</a></li>
        <li><a href="#">Portfolio</a></li>
        <li><a href="#">Поиск</a></li>
        </ul>
        </nav>
     </div>
        </header>
<!-- <CONTENT> -->
<?php 
$connection=mysql_connect("localhost","reklama","reklama") ;
$db=mysql_select_db(reklama);
mysql_set_charset("utf8");
if (!$connection || !$db)
{
exit(mysql_error());
}
$rezult=mysql_query("SELECT * FROM klienti ORDER BY id DESC");
mysql_close();
?>

<table align="center" >
<!--    <tr>Информация о клиентах</tr> -->
<tr  id="Add"  > 
   <td colspan="3"><a  href="#form" class="popup">Добавить клиента</a>  </td>
   <td colspan="3"><a  href="delete.php">Удалить клиента</a>  </td>
   <td colspan="3"><a  href="edit.php">Редактировать клиента</a>  </td>

</tr > 

<tr > 
<td id= "header"colspan="9"><b><font size="4" face="Arial" >Информация о клиентах </font></b></td>  <!--  тут растягиваем на 8 столбиков -->
</tr >

<tr >
     <th>Номер заказа </th>
     <th>Клиент </th>
     <th >ОП форма </th >
      <th >Наименование </th >
     <th>Отрасль </th >
     <th >Телефон </th >
      <th >Email </th >
     <th>Контактное лицо </th>
     <th >Должность </th >
     <th > Дата выполнения</th >
     <th >Дата добавления </th >
     <th >Время </th >
      <th >Действия </th >
      <!-- <th >Действия </th > -->
 </tr>
 <?php 
 while ($row=mysql_fetch_array($rezult)) 
{   ?> 
  <tr>
  <td><?php echo $row['id']?></td>
  <td><?php echo $row['klient']?></td>
    <td><?php echo $row['op_forma']?></td>
    <td><?php echo $row['naimen']?></td>
     <td><?php echo $row['otrasl']?></td>
    <td><?php echo $row['telefon']?></td>
    <td><?php echo $row['email']?></td>
     <td><?php echo $row['kont_lico']?></td>
 <td><?php echo $row['dolznost']?></td>
 <td><?php echo DateTime::createFromFormat("Y-m-d",$row['date1'])->format('d-??m-Y');?></td>
 <td><?php echo DateTime::createFromFormat("Y-m-d",$row['date'])->format('d-??m-Y');?></td>

 <td><?php echo $row['time']?></td>
 </tr>
 <?php } ?> 
</table>
<script src="js/common.js"></script>
</body>
</html> 

Common.js:

$(document).ready(function() {
$(".popup").magnificPopup();

});

$("document").ready(function() {
$ ("form").submit(function(event){
    event.preventDefault(); // !!!
    var dannie = $("form").serialize();
    $.ajax({
        url:'insert.php',
        type: 'POST',
        data: dannie,
        success: function (data) {
            if (data) {

                  alertify.set('notifier','position', 'top-right');
                  alertify.success('Клиент успешно добавлен!'); 
                                  } 
            else {          
            alertify.alert("Ошибка");
                 }
                }
});
});
});

// вывод текущей даты 
var date = new Date(); // Получаем текущую дату
var currentTimeZoneOffsetInHours = -date.getTimezoneOffset()/60; // Получаем разницу в часовых поясах
date.setHours(date.getHours() + currentTimeZoneOffsetInHours); // Прибавляем к текущей дате разницу и сохраняем в переменной date
document.getElementById('davaToday').valueAsDate = date; // Присваиваем значение даты в input
// обновление таблицы при нажатии батона
$('.submit').click(function(){    setTimeout(function() {window.location.reload();}, 2000);});

2 ответа 2

1

Нужно правильно отменить браузерный сабмит, и добавить таймаут обновления (если он теперь нужен) в success:

$("form").submit(function() {
  var dannie = $(this).serialize();
  $.ajax({
    url: 'insert.php',
    type: 'POST',
    data: dannie,
    success: function(data) {
      if (data) {
        setTimeout(function() {window.location.reload();}, 2000);
        alertify.set('notifier', 'position', 'top-right');
        alertify.success('Клиент успешно добавлен!');
      } else {
        alertify.alert("Ошибка");
      }
    }
  });
  return false; // !!!
});

И убрать слушателя:

$('.submit').click(...);

У вас не нем стоит type="submit", и клик на него будет ловиться в сабмите формы

3
  • Окно закрывается после нажатия баттона. А надо чтобы оставалось после нажатия
    – roman
    3 окт 2016 в 17:10
  • Это уже не в этой части кода, у меня вообще нет никакого окна 4 окт 2016 в 6:23
  • Подскажите пожалуйста,из какого файла вам нужен код, чтобы вы мне помогли? с этого? magnific-popup.css
    – roman
    4 окт 2016 в 16:30
-1
$('.submit').click(function() {
  setTimeout(function() {
    window.location.reload();
  }, 2000)}
);

Заменить на

$('.submit').click(function() {
  setTimeout(function() {
    $('form').trigger('submit');
  }, 2000)}
);
1
  • Теперь окно не закрывается само, но запись добавляется 2 раза подряд и данные не обновляются
    – roman
    3 окт 2016 в 10:43

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.