weixin_33688840 2018-08-25 14:48 采纳率: 0%
浏览 31

引导模态形式

I am having issues with my ajax form that is in a bootstrap modal. The first time I use the form it works just fine. The second time I use it (without a page refresh) the text area does not show up in the modal. I want the user to be able to use the form multiple times while on the page.

I have tried, among other things, to reset the form by using: $('#feedback').trigger('reset');

I have included a jsfiddle that shows the issue.

https://jsfiddle.net/uow7qfgz/11/#&togetherjs=1jQmKhwzSp

$(document).ready(function(){
        $("button#submit_comment").click(
                function(comment){
                    $("#feedback").html(comment);
                    $("#commentModal").modal('hide');
                    $('.modal-backdrop').remove();
            });
        });
<html>
<head>
<meta charset="UTF-8">
<title></title>

        <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" ></script>

</head>

<body>

    <button type="button" class="btn btn-primary btn-large" data-toggle="modal" data-target="#commentModal">Leave a Comment</button>


        
    <div class="modal fade" id="commentModal" role="dialog">
        <div class="modal-dialog">
            <!-- Modal content-->
            <div class="modal-content">           
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title">Comments</h4>
                </div>
                <div class="modal-body">
                    <form class="feedback" id="feedback">
                        <p>How can we help?</p>
                        <textarea style="min-width: 100%; " rows="10" name="comment" id="comment" ></textarea>
                    </form>
                </div>
                <div class="modal-footer">
                    <button class="btn btn-success" id="submit_comment">Send</button>
                    <a href="#" class="btn" data-dismiss="modal">Close</a>
                </div>
            </div>
        </div>
    </div>     
  
  </body>

Thanks in advance for any help.

</div>
  • 写回答

1条回答

      报告相同问题?

      相关推荐 更多相似问题

      悬赏问题

      • ¥15 c++字符串分割问题
      • ¥15 关于#sql#的问题:没有用命令关闭cdc,手动把系统表开启的cdc右键删除了
      • ¥15 vue+uniapp
      • ¥15 android freedom
      • ¥15 使用自定义的类型代替内置类型可行吗
      • ¥15 关于STM32的SPI和ENDAT接口编码器通信的问题
      • ¥15 关于#pdfbox#生成的PDF文件正常,转图片中文乱码的问题,如何解决?
      • ¥15 ADS中有关DAC控件的使用问题
      • ¥15 win11如何运行geoserver
      • ¥15 审稿意见请教-用ERNIE进行小样本分类的对比实验问题