AJAX表单将转到PHP脚本而不是提交

Question

我正在尝试使用AJAX将简单的插入查询发布到数据库； 但是，我正在使用while循环来生成多个PHP表单，这似乎引起了问题。 我对所有html表单都使用相同的类，并且我一直试图在AJAX中使用live函数，但它似乎没有用。 我只是想知道如何异步插入此数据。

谢谢您的帮助。

的PHP

 while ($row = $result->fetch_assoc()) {
    ?>  
        <div class='container'>
            <div class='moduleform'>
                <table id="t01">
                <tr><th colspan="3" id='upmost'>
    <?php
                echo 'Module Name: ' . $row['modulename'];
                $innermodname = $row['modulename'];

                echo "</th><th id='upmost'>";
                echo 'CAT Amount: ' . $row['catamount'];
    ?>
                </th></tr>
                <tr>
                    <th>Mark Name</th>
                    <th>Mark Achieved</th>
                    <th>Mark Percentage</th>
                    <th>Comments</th>
                </tr>
    <?php

                $innerquery2 = "SELECT moduleid FROM modules WHERE modulename='$innermodname'";

                if (!$result2 = $db->query($innerquery2)) {
                    die('There was an error running the query [' . $db->error . ']');
                }

                while ($row2 = $result2->fetch_assoc()) {
                    $ninnermodid = $row2['moduleid'];
                }

                $queryinner2 = "SELECT * FROM minimodules WHERE listid='$ninnermodid'";

                if (!$innerresult = $db->query($queryinner2)) {
                    die('There was an error running the query [' . $db->error . ']');
                }

                while ($innerrow = $innerresult->fetch_assoc()) {
                    echo "<tr><td>";
                    echo $innerrow['markname'];
                    echo "</td><td>";
                    echo $innerrow['markachieved'];
                    echo "</td><td>";
                    echo $innerrow['markpercentage'];
                    echo "</td><td>";
                    echo $innerrow['comments'];
                    echo "</td></tr>";
                }

    ?>

            </table>

            <form action='createmark.php' method='post' name='markform'>
                <input name='markname' placeholder='Result Name' maxlength='30'>
                <input name='markachieved' placeholder='Mark Achieved (0 if still to take)' maxlength='4'>
                <input name='markpercentage' step='1' placeholder='Percentage Of Module' maxlength='3' type='number'>
                <input name='comments' placeholder='Comments' maxlength='55'>
                <input name='hiddenid' value='<?php echo $ninnermodid; ?>' type='hidden'>
                <input type="submit" name="submit2" value='Add Mark' class='submit2'>
            </form>
        </div>
    </div>

    <?php

    }

AJAX

   $('document').ready(function() {

       $('.submit2').click(function() { 

             var markname = $('markname').val();
             var markachieved = $('markachieved').val();
             var markpercentage = $('markpercentage').val();
             var comments = $('comments').val();
             var hiddenid = $('hiddenid').val();

             $.ajax({

                url:        'createmark.php',
                type:       'POST',
                dataType:   'json',
                data:       '&markname=' + markname + '&markachieved=' + markachieved + '&markpercentage=' + markpercentage + '&comments=' + comments +'&hiddenid=' + hiddenid

             });         

            return false;

       });
    });

PHP脚本插入数据库

$markname = htmlspecialchars($_POST['markname'], ENT_QUOTES, 'utf-8');
$markachieved = htmlspecialchars($_POST['markachieved'], ENT_QUOTES, 'utf-8');
$markpercentage = htmlspecialchars($_POST['markpercentage'], ENT_QUOTES, 'utf-8');
$comments = htmlspecialchars($_POST['comments'], ENT_QUOTES, 'utf-8');
$hiddenid = htmlspecialchars($_POST['hiddenid'], ENT_QUOTES, 'utf-8');

$userid = $_SESSION['userid'];

$stmt = $db->prepare("INSERT INTO minimodules VALUES (?, ?, ?, ?, ?, ?)");
$stmt->bind_param('isiisi', $minimodulesid, $markname, $markachieved, $markpercentage, $comments, $hiddenid);
$minimodulesid = 'NULL';
$stmt->execute();

Answer 1

这都是错误的：

         var markname = $('markname').val();
         var markachieved = $('markachieved').val();
         var markpercentage = $('markpercentage').val();
         var comments = $('comments').val();
         var hiddenid = $('hiddenid').val();

首先， $('markname')是一个选择器，用于查找<markname>类的HTML元素。 要查找具有name="markname"的输入，它应该是$('input[name=markname]') 。

其次，您需要将选择器限制为正在提交的表单，因此应为$(this).find('input[name=markname]') 。

jQuery提供了一个功能，该功能可以查找表单中的所有输入字段，并以$.ajax ： $(this).serialize()所需的形式获取其所有值。 因此，代码应为：

   $('.submit2').click(function() { 
         var data = $(this).serialize();
         $.ajax({
            url:        'createmark.php',
            type:       'POST',
            dataType:   'json',
            data:       data
         });         
        return false;
   });