引导程序将数据传递到模态

Aronccs

我已经阅读了Bootsrap文档,甚至测试了它们的“基于触发按钮的变化模式内容”示例,但这是行不通的。

关于如何将数据传递给模式的任何想法,这样我就不会在页面中创建多个模式。

这是触发模式的按钮:

<a class="btn btn-danger" data-toggle="modal" data-target="#deleteSubject" data-whatever="<?= $subj_id ?>" role="button" title="Delete Subject"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></a>

这是模态:

<div class="modal fade" id="deleteSubject" tabindex="-1" role="dialog" aria-labelledby="deleteSubjectLabel">
          <div class="modal-dialog" role="document">
            <div class="modal-content">
                <form action="#" method="post">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="deleteSubjectLabel">Delete Subject</h4>
                  </div>
                  <div class="modal-body">
                    <h4>Do you want to delete this subject?</h4>
                    <input type="text" id="subjid" name="subjid">
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <button type="submit" class="btn btn-danger">Delete</button>
                  </div>
                </form>
            </div>
          </div>
        </div>

这是javascript:

<script>
        $('#deleteSubject').on('show.bs.modal', function (event) {
          var button = $(event.relatedTarget)
          var subjId = button.data('whatever')
          var modal = $(this)
          modal.find('.modal-body input').val(subjId)
        })
    </script>

我也尝试过,show.bs.modal但是什么没发生。我试图创建一个单独的脚本来测试是否$subj_id通过使用读取了,alert但它可以正常工作。

有任何想法吗?

加夫格里夫

您需要将代码包装在准备好的文档中,并且由于您输入的内容已命名并且具有ID-直接定位它,因此您将不需要查找:

<script>
    $(document).ready(function(){
        $('#deleteSubject').on('show.bs.modal', function (event) {
          var button = $(event.relatedTarget);
          var subjId = button.data('whatever');
          $('#subjid').val(subjId);
        })
    })
</script>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章