Bootstrap模态表单提交

时间:2016-01-05 15:07:48

标签: php jquery forms twitter-bootstrap form-submit

我使用HTML,Bootstrap CSS和PHP实现了一个工作模式表单,它显示了有关文档的信息。在Modal的页脚中,我有一个“删除文档”按钮,它应该发布到同一页面(index.php)。表单不会对提交按钮做出反应。

阅读这个主题很多人都在使用AJAX从Bootstrap Modal提交。这似乎没必要?我真的需要在AJAX中实现一个JSON帖子才能提交这个Modal吗?

代码:

<div class="modal-footer">
    <form action="index.php" method="post">
        <input type="hidden" name="DocumentID" value="<?php echo $row['DocumentID']; ?>" />
        <input type="hidden" name="top-search" value="<?php echo $_POST['top-search']; ?>" />
        <button type="submit" name="deleteDocument" class="btn btn-w-m btn-danger" onclick="return confirm('Are you sure you want to delete this Document?')">Delete</button>
    </form>
    <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
</div>

我有一个示例,其中Modal成功提交虽然使用类似的方法但使用target =“_ blank”

到另一个页面

1 个答案:

答案 0 :(得分:0)

它不是onclick - 而是onClick。

此外,您需要将脚本放在{}中。以下代码应该可以使用。

/*
 * A simple React component
 */
class Application extends React.Component {
  render() {
    return (<div class="modal-footer">
    <form action="index.php" method="post">
        <input type="hidden" name="DocumentID" value="<?php echo $row['DocumentID']; ?>" />
        <input type="hidden" name="top-search" value="<?php echo $_POST['top-search']; ?>" />
        <button type="submit" name="deleteDocument" class="btn btn-w-m btn-danger" onClick={ function() {
      return confirm("Yes/No?");
    }}>Delete</button>
    </form>
    <button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
</div>);
  }
}

/*
 * Render the above component into the div#app
 */
React.render(<Application />, document.getElementById('app'));