Javascript代码在while循环中不起作用

时间:2017-12-13 00:18:58

标签: javascript php jquery ajax forms

我正在尝试使用ajax提交表单,但该表单实际上是在表格中。我编写了一个表格,其中的行由while循环填充+每个行的按钮在单击时提交,但是当我单击按钮时没有任何问题。知道为什么吗?这是我的代码。此外,提交该表格是否正确?我的意思是为每个表单生成JS代码。

编辑: 甚至在将该功能更改为简单的.click之后,然后提醒它什么都不做。看起来它并没有被执行

while($row = $stmt->fetch())
{ $x++;
    echo '<tr>
    <form id="lululu-'. $x .'" method="post">
    <td>'. $x .'</td>
    <td><label>' .$row["WebName"] . '</label></td>
    <input type="hidden" name="clothes" value="'.$row["clothes"] .'"/>
    <input type="hidden" name="pieces" value="'.$row["pieces"] .'"/>
    <input type="hidden" name="userId" value="'.$row["userId"] .'"/>
    <td><img src="/img/knownitem.png" alt="Not found" /></td>
    <td><label>'.$row["gear"] .'</label></td>
    <td><label>1</label></td>
    <td><label>2</label></td>
    <td><label>3</label></td>
    <td><select name="selltype">
        <option value="1" name="1">1</option>
        <option value="0" name="0">0</option>
    </select></td>
    <td><input type="number" name="cost" min="1" style="width: 50px;" value="1"/></td>
    <td><input type="text" name="test"/></td>
    <td><input type="submit" name="submit" class="btn btn-primary btn-block" value="GetIn" /></td>
    </form></tr> 
    <script type="text/javascript">
    jQuery("#lululu-' . $x . '").submit(function (e) {
        e.preventDefault();
        $.ajax({
               type: "POST",
               url: "/duuh/test.php/",
               data: $("#lululu-'. $x .'").serialize(),
               success: function(data)
               {
    alert("success");
               }
             });
        });
    </script>
    ';
}
echo '  </table>
    </div>';

提前致谢。

1 个答案:

答案 0 :(得分:4)

只需从循环中删除javascript代码部分,然后使用循环外的下一个代码

<script type="text/javascript">
    jQuery("form[id^='lululu-']").submit(function (e) {
        e.preventDefault();
        $.ajax({
             type: "POST",
             url: "/duuh/test.php/",
             data: $(this).serialize(),
             success: function(data)
               {
                  alert("success");
               }
        });
    });
</script>

form[id^='lululu-'] - 选择以lululu-

开头的表单

$(this) - 请参阅此表单

个人:我更喜欢

1-使用$(document).ready(function(){ //code here })

中的js代码

2-使用.on('submit' , function(){})而非使用submit(function(){})

正如@incrediblehat在评论上所说的那样也可以通过向所有表格添加一个类class =“lulu-form”并匹配:$(“。lulu-form”)。 ....无论哪种方式都有效