How to use the ladda.create function in ladda

To help you get started, we’ve selected a few ladda examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github moff / angular2-ladda / projects / ladda / src / lib / ladda.directive.ts View on Github external
ngOnInit() {
        this.ladda = createLadda(this.el);

        // if the initial loading value isn't false, a timeout of 0 ms
        // is necessary for the calculated spinner size to be correct.
        setTimeout(() => { this.updateLadda(false); }, 0);
    }
github Lugribossk / dropwizard-experiment / common / common-client / src / main / javascript / ui / Form.js View on Github external
setTimeout(function () {
                    var button = Ladda.create(scope.ui.submit.get(0));
                    button.start();
                    var submitPromise = scope.view.onFormSubmit();

                    if (submitPromise) {
                        submitPromise.finally(function () {
                            if (!scope.isDestroyed) {
                                button.stop();
                            }
                        });
                    }
                }, 0);
github alimranahmed / LaraBlog / resources / assets / js / components / article / Comments.vue View on Github external
addReply (reply) {
                let l = Ladda.create(document.querySelector('#reply-submit-btn'));
                l.start();

                axios.post(this.add_comment_url, reply)
                    .then( (response) => {
                        console.log(response);
                        //hide comment form
                        $("#comments").html(response.body);
                        $('.modal').modal('hide');
                        $('body').removeClass('modal-open');
                        $('.modal-backdrop').remove();
                        //show success alert
                        let successAlert = $('#success-alert');
                        successAlert.show();
                        successAlert.fadeOut(1000 * 10);
                        $('#success-msg').html('Success! your reply will be published soon');
                        //clear form values
github alimranahmed / LaraBlog / resources / assets / js / components / article / ArticleForm.vue View on Github external
storeArticle() {
                let l = Ladda.create(document.querySelector('#submit-btn'));
                l.start();

                axios.request({
                    method: this.method,
                    url: this.url,
                    data: this.article_data

                }).then( (response) => {
                    l.stop();
                    location.href = response.data.redirect_url;

                }).catch( (error) => {
                    l.stop();
                    alertError(error.response.data.errorMsg);
                })
            }
github Dahlgren / arma-server-web-admin / public / js / app / views / mods / form.js View on Github external
shown: function (modal) {
      var $okBtn = modal.$el.find('.btn.ok');
      $okBtn.addClass('ladda-button').attr('data-style', 'expand-left');

      this.laddaBtn = Ladda.create($okBtn.get(0));

      this.$el.find('form .mod').focus();
    },
github Dahlgren / arma-server-web-admin / public / js / app / views / missions / upload.js View on Github external
submit: function () {
    var self = this
    var $form = this.$el.find('form')

    var $uploadBtn = $form.find('button[type=submit]')
    var laddaBtn = Ladda.create($uploadBtn.get(0))
    laddaBtn.start()

    $.ajax('/api/missions', {
      success: function (data) {
        laddaBtn.stop()
        self.render()
      },
      error: function () {
        laddaBtn.stop()
      },
      files: $form.find(':file'),
      iframe: true
    })
  }
})
github alimranahmed / LaraBlog / resources / assets / js / components / article / CommentForm.vue View on Github external
addComment(comment) {
                let l = Ladda.create(document.querySelector('#submit-comment-btn'));
                l.start();

                axios.post(this.add_comment_url, comment)
                    .then(response => {
                        //hide comment form
                        $("#comments").html(response.body);
                        $('#comment-form').hide();
                        alertSuccess('Success! you comment will be published soon');
                        //clear form values
                        $('input').val('');
                        $('textarea').val('');
                        l.stop();
                    })
                    .catch(error => {
                        alertError(error);
                        l.stop();
github Dahlgren / arma-server-web-admin / public / js / app / views / missions / workshop.js View on Github external
submit: function () {
    var self = this
    var $form = this.$el.find('form')

    var $downloadBtn = $form.find('button[type=submit]')
    var laddaBtn = Ladda.create($downloadBtn.get(0))
    laddaBtn.start()

    $.ajax({
      url: '/api/missions/workshop',
      type: 'POST',
      data: {
        id: $form.find('input.workshop').val()
      },
      dataType: 'json',
      success: function (data) {
        laddaBtn.stop()
        self.render()
      },
      error: function () {
        laddaBtn.stop()
      }
github ayoisaiah / stellar-photos / src / js / libs / handle.js View on Github external
const updateCollections = () => {
  const collectionsInput = $('unsplash-collections__input');
  const collections = collectionsInput.value.trim().replace(/ /g, '');

  if (!collections) {
    notifySnackbar('Collection IDs not valid!', 'error');

    return;
  }

  const spinner = Ladda.create(document.querySelector('.update-collections'));
  spinner.start();

  validateCollections(collections)
    .then(() => {
      chrome.storage.sync.set({ collections }, () => {
        notifySnackbar('Collection saved successfully');
      });

      chrome.runtime.sendMessage({ command: 'load-data' });
    })
    .catch(() => {
      notifySnackbar(
        'Failed to save collections. Please check that the collection exist',
        'error'
      );
    })
github jsdir / react-ladda / src / LaddaButton.jsx View on Github external
componentDidMount() {
    this.laddaInstance = Ladda.create(this.node)

    if (this.props.loading) {
      this.laddaInstance.start()
    }

    if (!isUndefined(this.props.progress)) {
      this.laddaInstance.setProgress(this.props.progress)
    }
  }

ladda

Buttons with built-in loading indicators

MIT
Latest version published 3 years ago

Package Health Score

62 / 100
Full package analysis

Similar packages