javascript - 从表单获取数据并在引导模式中显示它们

标签 javascript jquery

我有一些行,每行都附加了数据属性。当我单击每个表格行时,我想将数据属性发送到另一个表单,并以模式显示表单

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <div class="col-md-3">
      <div class="img-container medium" style="overflow: hidden; position:relative;margin-left:-13px;">
        <img class="loaded" src="img/a.jpg" style="width: auto; height: 245px; top:0px; left:-66px;">
      </div>
    </div>

    <div class="col-lg-4 col-md-3 col-sm-4">
      <div class="namasm">kamar</div>
      lorem ipsum
      <div class="clearfix mt10">
        <span class=""></span>
      </div>
    </div>

    <div class="col-lg-2 col-md-2 col-sm-3 text-center sep">
      <div class="price">
        <span>$20</span>
      </div>
      <div class="mb10 text-muted" id="bb">Price / 1 night(s)</div>
      Capacity :
      <i class="glyphicon glyphicon-user"></i>
      x2
      <p class="lead pt10">
        <button class="btn btn-success btn-lg btn-block" id="kklik" data-name="kamar" data-toggle="modal" data-target="#modalInfo">
          <i class="glyphicon glyphicon-hand-right"></i>
          Book
        </button>

      </p>

    </div>

<div id="modalInfo" class="modal fade" aria-hidden="true" role="dialog" aria-labelledby="modalInfoLabel">
     <div class="modal-dialog modal-lg">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Booking</h4>
      </div>
      <div class="modal-body">
      <!-- php file -->
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>

我已经尝试过这个( get data attribute and show in bootstrap modal ),但它不起作用。

最佳答案

    $('#fileInfo tr td').on('click', function(){
        var data = $(this).closest('tr').attr('data-name');
        $('#modalInfo').modal('show');
        $('#modalInfo').find(".filename").html(data);;
    });

data-toggle="modal"data-target="#modalInfo"从表格元素中删除此元素

关于javascript - 从表单获取数据并在引导模式中显示它们,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37046931/

相关文章:

javascript - Stripe 元素的流程是什么?

javascript - 检查多个变量是否已设置的最佳方法是什么?

javascript - Ajax 调用后尝试重新加载 Javascript

javascript - Foreach 目录中的文件 jQuery

c# - 在 asp.net web 应用程序的 Gridview 中使用 shift + 滚动的水平滚动?

html - 浏览器缩放时无法修复 slider 移动距离

javascript - 添加div onClick功能并切换div

Javascript:根据屏幕分辨率调用不同的函数

javascript - Select2 在前 N 个字符后开始匹配

javascript - Ajax 异步回调 beforesend