使用Ajax提交兩次表單

我試圖使用Ajax提交表單,但是它提交了兩次輸入的值。你能幫我防止這個問題嗎?我試著從前面的問題中提出了幾個建議,但都沒有奏效。

Thank you

Html Code:

<form id="ratingForm" method="POST">
    <div class="form-group">
        <h4>Rate this product</h4>
        <!-- Start Star -->
        <button type="button" class="btn btn-warning btn-sm rateButton" aria-label="Left Align">
          <span class="glyphicon glyphicon-star" aria-hidden="true"></span>
        </button>
        
        <button type="button" class="btn btn-default btn-grey btn-sm rateButton" aria-label="Left Align">
          <span class="glyphicon glyphicon-star" aria-hidden="true"></span>
        </button>
        
        <button type="button" class="btn btn-default btn-grey btn-sm rateButton" aria-label="Left Align">
          <span class="glyphicon glyphicon-star" aria-hidden="true"></span>
        </button>
        
        <button type="button" class="btn btn-default btn-grey btn-sm rateButton" aria-label="Left Align">
          <span class="glyphicon glyphicon-star" aria-hidden="true"></span>
        </button>
        
        <button type="button" class="btn btn-default btn-grey btn-sm rateButton" aria-label="Left Align">
          <span class="glyphicon glyphicon-star" aria-hidden="true"></span>
        </button>
        <!-- End Star -->

        <input type="hidden"  id="rating" name="rating" value="1">
        <input type="hidden"  id="itemId" name="itemId" value="<?php echo $_GET['id']; ?>">
        <input type="hidden" name="action" value="saveRating">
    </div>      
    <div class="form-group">
        <!--Comment Start-->
        <label for="usr">Title*</label>
        <input type="text"  id="title" name="title" required>
    </div>
    <div class="form-group">
        <label for="comment">Comment*</label>
        <textarea rows="5" id="comment" name="comment" required></textarea>
    </div>
    <div class="form-group">
        <button type="submit" class="btn btn-info" id="saveReview">Save Review</button>
    </div>
     <!--Comment End-->          
</form>

Js Code:

$('#ratingForm').on('submit', function(event){
  event.preventDefault();
  event.stopImmediatePropagation();
    var formData = $(this).serialize();
    $.ajax({
        type : 'POST',
        dataType: "json",   
        url : 'action.php',                 
        data : formData,
        success:function(response){
            if(response.success == 1) {
                $("#ratingForm")[0].reset();
                window.location.reload();
            }
        }
    }); 
});

Php代碼(這是action.php文件):Execution.php文件使用mysql將數(shù)據(jù)插入數(shù)據(jù)庫。

<?php
session_start();
include 'class/Execution.php';
$rating = new Rating();

if(!empty($_POST['action']) && $_POST['action'] == 'saveRating'  
    && !empty($_POST['rating']) 
    && !empty($_POST['itemId'])) {
        $rating->saveRating($_POST, $_SESSION['userId']);   
        $data = array(
            "success"   => 1,   
        );
        echo json_encode($data);        
}

?>
? 最佳回答:

你能試試下面的代碼嗎

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Js Check</title>
<script src="https://code.jquery.com/jquery-3.5.1.min.js" language="javascript"></script>
</head>

<body>
<div id="wrapper">
  <form id="ratingForm" method="POST">
    <div class="form-group">
      <h4>Rate this product</h4>
      <!-- Start Star -->
      <button type="button" class="btn btn-warning btn-sm rateButton" aria-label="Left Align"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span> </button>
      <button type="button" class="btn btn-default btn-grey btn-sm rateButton" aria-label="Left Align"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span> </button>
      <button type="button" class="btn btn-default btn-grey btn-sm rateButton" aria-label="Left Align"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span> </button>
      <button type="button" class="btn btn-default btn-grey btn-sm rateButton" aria-label="Left Align"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span> </button>
      <button type="button" class="btn btn-default btn-grey btn-sm rateButton" aria-label="Left Align"> <span class="glyphicon glyphicon-star" aria-hidden="true"></span> </button>
      <!-- End Star -->
      
      <input type="hidden"  id="rating" name="rating" value="1">
      <input type="hidden"  id="itemId" name="itemId" value="<?php echo $_GET['id']; ?>">
      <input type="hidden" name="action" value="saveRating">
    </div>
    <div class="form-group"> 
      <!--Comment Start-->
      <label for="usr">Title*</label>
      <input type="text"  id="title" name="title" required>
    </div>
    <div class="form-group">
      <label for="comment">Comment*</label>
      <textarea rows="5" id="comment" name="comment" required></textarea>
    </div>
    <div class="form-group">
      <button type="submit" class="btn btn-info" id="saveReview">Save Review</button>
    </div>
    <!--Comment End-->
  </form>
</div>
<script>
jQuery(document).ready(function($) {
        
        $('#ratingForm').on('submit', function(event){
          event.preventDefault();
          event.stopImmediatePropagation();
            var formData = $(this).serialize();
            $.ajax({
                type : 'POST',
                dataType: "json",   
                url : 'action.php',                 
                data : formData,
                success:function(response){
                console.log(response);
                    if(response.success == 1) {
                        $("#ratingForm")[0].reset();
                        window.location.reload();
                    } 
                }
            }); 
        });
});
</script>
</body>
</html>
主站蜘蛛池模板: 成人无码精品一区二区三区| 日韩精品无码一区二区三区不卡| 国产在线一区视频| 久久一本一区二区三区| 国产精品无圣光一区二区| 国产主播福利精品一区二区| 精品国产免费一区二区三区| 波多野结衣中文字幕一区| 精品日韩一区二区| 国产成人一区二区动漫精品| 无码丰满熟妇浪潮一区二区AV| 精品亚洲AV无码一区二区| 一区二区三区免费视频观看| 在线不卡一区二区三区日韩| 精品无码一区二区三区爱欲九九| 精品国产日产一区二区三区| 日韩人妻一区二区三区免费| 亚洲一区电影在线观看| 伊人精品视频一区二区三区| 大屁股熟女一区二区三区| 日本丰满少妇一区二区三区 | 亚洲国产高清在线一区二区三区| 国产伦精品一区二区三区| 久久中文字幕无码一区二区| 亚洲美女高清一区二区三区| 亚洲性无码一区二区三区| 一区五十路在线中出| 亚洲av无码一区二区三区在线播放| 亚洲a∨无码一区二区| 日本亚洲成高清一区二区三区| 动漫精品专区一区二区三区不卡 | 国产成人精品a视频一区| 亚洲一区二区三区高清不卡| 日本成人一区二区三区| 午夜福利国产一区二区| 国产成人高清精品一区二区三区| 亚洲日韩中文字幕一区| 国产乱码一区二区三区四| 无码一区二区三区免费| 色欲综合一区二区三区| 国偷自产av一区二区三区|