Как проверить отправленную форму JavaScript, используя глобальный POST

Изображение одно - это то, как страница отображается при загрузке браузером. Изображение 2 - когда элемент списка дважды щелкнул. На рисунке 3 показан результат нажатия на карандаш (который является исходным элементом формы). Вы можете видеть, что элемент списка имеет доступное значение, поскольку он печатает целое число в предупреждении, поэтому я не уверен насчет приведенного ниже комментария, относящегося к этому. Я также не понимаю, как это дублирует предыдущий предложенный вопрос, так как при нажатии на img выполняется логическая проверка $_POST['edit']. Пожалуйста, не отмечайте это как дубликат, поскольку это не так! В ответе мой вопрос был помечен как дубликат, в котором указано, что "элементы ввода img не могут публиковать данные на сервере и должны быть заключены в кнопку". Это, на мой взгляд, должно быть неверно, так как как моя страница может изменять состояние на основе клика img, если он не доставляет данные по почте, как переменная POST может быть установлена ​​с помощью клика img, если она не может передавать данные на сервер. Если вопрос помечен как дубликат, то исходный ответ должен касаться той же проблемы и / или содержать правильную информацию, если это не так, то я упал, этот вопрос должен стоять как оригинал!

когда страница загружается

при двойном щелчке элемента li

введите описание изображения здесь

<html>
<head>
<script  src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>

<body>
<?php
  if(isset($_POST['edit']) ) 
  {
  ?>
    <p>window is in edit mode</p>
  <?php
  }
  else
  {
  ?>
    <p>window is not in any mode</p>
    <form id="form-edit"  method="POST" name="form-edit"  action=" <?php echo $_SERVER['PHP_SELF']; ?>">
      <input type="image" id="edit-button" name="edit" value="1"  src="../images/pencil.png" class="course-banner-edit"> 
    </form>
    <?php
    }
    ?>
    <script>
      $(document).ready(function() {

       /**********************************************
       PROBLEM WITH THIS FUNCTION 
       **********************************************/  
        $('li').dblclick(function() {
          $('#form-edit').submit();
       /******************************************
      THE ALERT TRIGGERS AND THE VALUE IS REPORTED AS ONE WHICH IS CORRECT
        *****************************************/  
          alert( $("input[name=edit]").val() );
        });
     }); 
     </script> 
   </body>
  </html>

1 ответ

Решение

Элементы ввода типа image не принимают атрибуты значения. попробуйте что-то вроде этого:

<form id="form-edit" method="POST" name="form-edit" action="<?php echo $_SERVER['PHP_SELF']; ?>">
    <button type="button">
        <img src="" alt="">
    </button>
    <input type="hidden" name="edit" value="1">
</form>

Чтобы лучше понять, как это работает, попробуйте отправить эту форму различными кнопками и посмотреть, что произойдет.

<html>
<head>
</head>

<body>
<?php var_dump($_POST); ?>
<form id="form-edit" method="POST" name="form-edit" action="#">
    <input type="image" id="edit-button" name="first_submit_button" src="...">
    <input type="image" id="edit-button" name="second_submit_button" src="...">
    <input type="submit" value="third submit button">
</form>

<ul>
    <li>submit via javascript</li>
</ul>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
  $(document).ready(function() {
    $('li').click(function() {
      $('#form-edit').submit();
    });
  });
</script>
</body>
</html>
Другие вопросы по тегам