亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

PHP & jQuery 表單提交問題

PHP & jQuery 表單提交問題

PHP
江戶川亂折騰 2022-10-09 17:14:49
我正在創建網站項目,您可以在帖子發布后對其進行編輯。我已經使用 PHP、SQL 和 jQuery 創建了網站,并且所有發布到該網站的帖子都通過 while 循環(不包括在此問題內容中)輸出到網站“提要”。所有帖子在發布時(在數據庫中)都有一個唯一的 ID。我現在遇到的問題是第二種形式(post__edit)根本沒有提示。我發現我需要在<input type="hidden" value="$postID">字段中傳遞帖子的 id。下面的這個表單只是提示用于提交帖子更改的實際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 事件監聽器,該事件監聽器會以淡入淡出的形式(post_edit)讓您對帖子進行更改并提交它們。$('.post__editBtn').click(function() {    $('.post__edit').fadeIn();});然后我有一個 PHP if 語句來檢查隱藏值是否已設置。如果有,那么我會回顯先前隱藏的表單,并分配一個 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 淡入效果(使用$postID)jQuery 只是以第二種形式淡出(post__edit)第二種形式(post__edit)獲取post__editHidden值(正確帖子的正確 ID)并將其分配給 SESSION 變量,該變量稍后可用于進行 SQL UPDATE 查詢,該查詢在最終提交第二種形式時運行(到 updatePost. php)。我相信因為我設置了第一個表單按鈕,type="button"所以它不會提交表單,所以isset($_POST['post__editHidden']不會運行。但是,如果我將按鈕更改為正常的提交類型,那么第一個表單就會出現并重新加載它所在的頁面。我可能只是e.preventDefault在我的 jQuery fadeIn 中,但我不知道這是否有效。我對 PHP 和 SQL 很陌生,所以我可能全都錯了。不管怎么說,多謝拉!
查看完整描述

1 回答

?
慕的地6264312

TA貢獻1817條經驗 獲得超6個贊

這更像是一個建議的替代方案,而不是一個答案。


會話變量的使用在其他情況下會更有用,例如我們可以混淆 ID 值或在孤立(斷開連接)導航級別中重用它......

但在這種情況下,我最好只使用一個表單并使用 Ajax 填充它的輸入值。

此演示僅更新 postId' 32 的值......當它與獲取 Id 并返回它的 jSon 對象的功能性動態 ajax 處理程序一起使用時,它應該可以工作。

$('.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 調用它,我們在其中獲得一個 ID,我們確實從數據庫中獲取該記錄以返回我們的 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"}


查看完整回答
反對 回復 2022-10-09
  • 1 回答
  • 0 關注
  • 110 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號