PHP & jQuery вопрос отправки формы

Question

Я создаю проект веб-сайта, где вы можете редактировать сообщение после его публикации. Я сделал сайт с PHP, SQL и jQuery, и все публикации, которые публикуются на сайте, выводятся на веб-сайты "feed" через while-l oop (не включены в это содержание вопросов). Всем публикациям присваивается уникальный идентификатор, когда они публикуются (в базе данных).

У меня сейчас проблема в том, что вторая форма ( post__edit ) вообще не запрашивается.

Я понял, что мне нужно передать идентификатор сообщения в поле <input type="hidden" value="$postID">. Эта форма ниже просто запрашивает фактическую post_edit форму, которая используется для отправки изменения сообщения.

echo '
 <form method="post"> 
   <button type="button" class="post__editBtn">Edit post</button> 
   <input type="hidden" name="post__editHidden" value="'.$postID.'">
 </form>';

Когда класс кнопки: post__editBtn нажимается, jQuery click eventlistener срабатывает, что исчезает в форме ( post_edit ), что позволяет вам вносить изменения в сообщение и отправлять их.

$('.post__editBtn').click(function() {
    $('.post__edit').fadeIn();
});

Тогда у меня есть PHP if-statment, который проверяет, было ли установлено скрытое значение. Если это так, то я повторяю ранее скрытую форму и назначаю переменную SESSION, которая будет использоваться позже при выполнении запроса UPDATE.

if(isset($_POST['post__editHidden'])) {
  $_SESSION['post__editHidden'] = $_POST['post__editHidden'];

  echo'
  <form method="post" action="../../php/includes/updatePost.php" class="post__edit">
   <input type="text" name="postTitle" placeholder="Edit title" required>
   <textarea name="postMsg" maxlength="255" placeholder="Edit message" required></textarea>
   <button type="submit">Edit Post</button>
   <button class="post__edit-close">Close</button>
  </form>';
 }

Для суммирования

• Первый форма запускает эффект jQuery fadeIn для сообщения (с $ postID )
• jQuery просто исчезает во второй форме ( post__edit )
• Вторая форма ( post__edit ) принимает значение post__editHidden (правильный идентификатор для правильного сообщения) и присваивает его переменной SESSION, которая впоследствии может быть использована для создания SQL UPDATE запрос, который выполняется, когда вторая форма окончательно отправлена ​​(на updatePost. php).

Я верю, что, поскольку у меня для кнопки первой формы установлено значение type="button", она не передает форма так isset($_POST['post__editHidden'] не работает. Но если я изменю кнопку на обычный тип отправки, то первая форма просто отправляется и перезагружает страницу, на которой она находится. Я мог бы просто e.preventDefault в моем jQuery fadeIn, но я не знаю, работает ли это.

Я совершенно новичок в PHP и SQL, так что я могу ошибаться. В любом случае, спасибо!

Answer 1

Это скорее предложенная альтернатива, чем ответ.

---

Использование переменной сеанса было бы более полезным в других случаях, когда мы могли бы запутать значение идентификатора, например, или повторно использовать это на бесхозном (отключенном) уровне навигации ...

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

Это демо обновляет значения только для postId '32 ... Он должен работать, когда он используется вместе с функциональным обработчиком динамического c ajax, который получает идентификатор и возвращает объект jSon.

$('.post__editBtn').click(function() {
var myform = $('.post__edit');
var postId=$(this).attr('data-id');
    myform.find("input[name='post__editHidden']" ).val(postId);    
    
    $.ajax({
        type: "GET",
        dataType: "json",
        url: "https://api.myjson.com/bins/kx5xs", // replace with php later
        data: {id: postId},
        success: function(data) {
           myform.find("input[name='postTitle']" ).val(data[0].title);
          myform.find("textarea[name='postMsg']" ).val(data[0].content);
        },
        error : function(){
           alert('Some error...!');
        }
    });
    
    $('.post__edit').fadeIn();
    
    
    //for demo puropose to show the new value in the update form:
    console.log($(".post__edit input[name='post__editHidden']").val());
});

.post__edit{
display:none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class"post">
   Post 30<button type="button" data-id="30" class="post__editBtn">Edit post</button> 
   </div>
<div class"post">   
   Post 32<button type="button" data-id="32" class="post__editBtn">Edit post</button> 
</div>   
<div class"post">
     Post 37 <button type="button" data-id="37" class="post__editBtn">Edit post</button> 
</div>      
   <!--all data-id values would be replaced with '.$postID.' in the php loop-->
 
 <form method="post" action="../../php/includes/updatePost.php" class="post__edit">
   <input type="text" name="postTitle" placeholder="Edit title" required>
   <textarea name="postMsg" maxlength="255" placeholder="Edit message" required></textarea>
   <button type="submit">Save Post</button>
   <button class="post__edit-close">Close</button>
    <input type="hidden" name="post__editHidden" value="">
  </form>

И мы добавляем файл ex: ajax. php, который мы вызываем с помощью ajax, где мы получаем идентификатор, мы делаем получить эту запись из базы данных, чтобы вернуть наш json. Примерно так:

<?php

$id=$_GET['id'];
$stmt = $conn->query("SELECT title,content * FROM posts WHERE postId=$id LIMIT 1");
$result=...
echo json_encode($result);

Чтобы получить jSon вот так:

{"id": "32","title": "POst 32","content": "POst 32 talks about HiTECH"}