3

我有一个使用 twitter 引导模式的弹出窗口。我想在显示弹出窗口之前调用控制器操作,并将控制器操作中的变量值显示到弹出窗口中。ajax 没有调用控制器操作。还有其他方法吗?

我的普惠制:

<g:javascript>
        $(document).ready(function() {
          $('#myModal').on('show', function () {
            $.ajax({
              type: "GET",
              url: "${createLink(controller: 'mGMatrices', action: 'popup')}" 
            }).done(function(data) {
                $('#modal-body').html(data);
            });

          });//end on()
        });//end ready()
      </g:javascript>

       <g:textField name="inputField" />
      <!-- Button to trigger modal -->
      <a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>


      <!-- Modal -->
      <div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
          <h3 id="myModalLabel">Modal header</h3>
        </div>
        <div class="modal-body">
             <p>some content</p>
             <input type="text" name="bookId" id="bookId" value=""/>
        </div>
      </div>
4

2 回答 2

3

您的代码是完美的,在代码稍作更改后它对我有用。

您正在使用 # 表示 id 而不是类。

$('#modal-body').html(data);

用。。。来代替 。

例如

$('.modal-body').html(data);

试试这个并享受......

编辑................................................. ......................

        $.ajax({
          type: "GET",
          url: "${createLink(controller: 'mGMatrices', action: 'popup')}",
          data: "inputField="+$("[name='inputField']").val()+"&fieldName="+$("[name='fieldNAme']").val()
        }).done(function(data) {
            $('#modal-body').html(data);
        });
于 2013-07-30T06:12:39.797 回答
1

您在评论中的问题:

I need to call first the action in the controller before displaying the popup.

回答:按照说明稍微更改您的代码。

<g:javascript>
    function callMe(){
      $.ajax({
      type: "GET",
      url: "${createLink(controller: 'mGMatrices', action: 'popup')}",
      data: "aa="+$("[name='inputField']").val()
        }).success(function(data) {
            $('.modal-body').html(data);
            $('#myModal').modal('show');
        });
    }
</g:javascript>

<g:textField name="inputField"/>
<!-- Button to trigger modal -->
<a href="javascript:void(0)" class="btn" onclick="callMe()">Launch demo modal</a>



<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>

        <h3 id="myModalLabel">Modal header</h3>
    </div>

    <div class="modal-body">
        <p>some content</p>
        <input type="text" name="bookId" id="bookId" value=""/>
    </div>
</div>
于 2013-08-02T09:29:33.147 回答