2016-07-26 115 views
0

我想显示一个包含“OK”按钮的Bootbox对话框。当用户点击“确定”按钮时,它应该回发,并用消息的ID来确认用户已经查看了消息。 Bootbox对话框是表单。我没有看到使对话框按钮成为带有隐藏字段的提交表单的方式,这是我认为是实现我的目标的正确方法。在Bootbox对话框中输入

+1

貌似插件有一个回调函数的提示。你可以用它来代替。 –

+1

来自[this](http://bootboxjs.com/examples.html)的最后一个例子展示了一种在Bootbox对话框中使用表单的方法。这是你寻找的这种东西吗? – Mistalis

+0

@IsabelInc - 我正在看看去那条路线 – Sonny

回答

0

感谢Isabel IncMistalis的有用评论,我有一个工作解决方案。具体到我的实现

注:

  • 的消息包含需要响应的图像,所以我相应的自举类添加到每个图像
  • 的消息可能有联系。点击一个链接就相当于点击对话框

,这使得它发生JavaScript的“OK” ......

jQuery(function($, window, bootbox, undefined) { 
    var accept = function(callback) { 
     $.ajax({ 
      type: 'POST', 
      data: {message_id: 244826}, 
      success: callback() 
     }); 
    }; 

    var $message = $('<p><img src="https://www.gravatar.com/avatar/80fa81938a6d1df92cd101d7fe997a71" alt></p><p>Here is a message from <a href="https://stackoverflow.com/users/244826/sonny">Sonny</a>.</p>'); 
    $message.find('img').addClass('img-responsive center-block'); 
    $message.find('a').on('click', function(e) { 
     var href = $(this).attr('href'); 
     if (0 === href.length) { 
      return; 
     } 
     e.preventDefault(); 
     accept(function() { window.location.href = href; }); 
    }); 

    bootbox.dialog({ 
     message: $message, 
     closeButton: false, 
     buttons: { 
      accept: { 
       label: 'OK', 
       callback: function() { 
        accept(function() { window.location.reload(); }); 
       } 
      } 
     } 
    }); 
}(jQuery, window, bootbox));