带有coldfusion的Bootstrap模态向导,显示数据步骤=" 2"来自data-step =" 1"

时间:2015-04-15 21:32:21

标签: twitter-bootstrap coldfusion bootstrap-modal

当你点击按钮"启动演示模式"我使用bootstrap创建一个弹出窗口,它将有一个向导。它将为您提供弹出窗口以选择日期,然后您将单击下一步,在相同窗口的下一页上我想以某种方式显示来自第一个窗口的选择的结果,请参阅下面的我正在寻找的内容要做,某些标签可能不合适,但这应该给你一个想法。如果已经有经验或者有其他方法可以做到这一点,那么就会感激输入。

我有一个问题是如何制作"下一个按钮"保存日历中的选择,然后我可以将其输出到下一步。

启动演示模式

<!-- Modal -->
  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="js-title-step"></h4>
        </div>
        <div class="modal-body">
          <div class="row hide" data-step="1" data-title="Please select the date!">
            <div class="well">
  <b>Please select a date on the calendar and click Next.</b><br>
  <br>
  <cfform>
  <table>
  <tr>
  <td><strong>Start Date</strong>:</td>
          <td><cfinput type="datefield"  name="dte_one" size="10" /></td>
  </tr>
  </table>
  </cfform>
    </div>
          </div>
          <div class="row hide" data-step="2" data-title="This is the second and last step!">
            <div class="well">
               <h3 style="color:OrangeRed;"> 
                    Your Joining date is: <cfoutput>#DateFormat(Form.dte_one)# </cfoutput>
             </h3>
           </div>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default js-btn-step pull-left" data-orientation="cancel" data-dismiss="modal"></button>
          <button type="button" class="btn btn-warning js-btn-step" data-orientation="previous"></button>
          <button type="button" class="btn btn-success js-btn-step" data-orientation="next"></button>
        </div>
      </div>
    </div>
  </div>

1 个答案:

答案 0 :(得分:0)

这就是我在CF中激活模态所做的,我在href中添加2#,这是你可以用按钮尝试的。

<a href="##?URL=#Name#" data-toggle="modal" data-target="##ModalID">#DataName#</a>