如何使用Ladda UI for Bootstrap 3

时间:2013-12-20 03:39:34

标签: jsp servlets twitter-bootstrap-3

我对“Ladst UI for Bootstrap 3”有点困惑,它将加载指标合并到调用它们的动作中。当我单击按钮时,它将执行SQL查询。那么,每当查询完成后如何停止旋转效果?我使用jsp和servlets。

1 个答案:

答案 0 :(得分:-1)

请参阅:http://msurguy.github.io/ladda-bootstrap/了解文档。

$(function() {
    $('#form-submit').click(function(e){
        e.preventDefault();
        var l = Ladda.create(this);
        l.start();
        $.post("your-url", 
            { data : data },
          function(response){
            console.log(response);
          }, "json")
        .always(function() { l.stop(); });
        return false;
    });
});

这里your-url应该是一个预先形成你的sql的URL,这个url的结果应该是:

The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response (an XML MIME type will yield XML, in 1.4 JSON will yield a JavaScript object, in 1.4 script will execute the script, and anything else will be returned as a string). The available types (and the result passed as the first argument to your success callback) are: xml, html, json, jsonp or text

现在,您可以根据您的回复数据或ajax请求调用l.stop;

// Assign handlers immediately after making the request,
// and remember the jqxhr object for this request
var jqxhr = $.post( "example.php", function() {
  alert( "success" );
})
  .done(function() {
    alert( "second success" );
  })
  .fail(function() {
    alert( "error" );
  })
  .always(function() {
    alert( "finished" );
});