Using jQuery UI Dialog with Backbone.js and RequireJS [duplicate]

Question

I would like to do popups on my first webpage which using a backbone.

define(['jquery',
'jqueryui',
'underscore',
'backbone',
'api',
'text!' + versions.getVersionedPath('templates/form.html')

 function ($, jqueryui, _, Backbone, Api, Form) {
    var widok = Backbone.View.extend({
        formularz: _.template(Form),
        el: 'body',
        events: {
            'click #test': 'test',
            'click .del': 'usun',
            'click #elo': 'test2'
        },
        initialize: function () {
            this.$el.html(this.formularz());
            self = this;
            console.log('This model has been initialized.');
            this.render();
        },
        render: function () {
            console.log('Showing up');
                    this.$el.html(this.formularz());
        },
        test: function () {
            self.showNews();
            return false;

        },
        test2: function () {
            $("#dialog-confirm").dialog({
                resizable: false,
                height: 140,
                modal: true,
                buttons: {
                    "Delete all items": function () {
                        $(this).dialog("close");
                    },
                    Cancel: function () {
                        $(this).dialog("close");
                    }
                }
            });
        }
    });

    return {initialize: function () {
            console.log('Initialize');
            new widok;
            self.showNews();
            console.log('blablablablabla');
        }};

});

I have function like this, but when I'm trying to use it I had error like

Uncaught TypeError: $(...).dialog is not a function.

I have defined jquery and jqueryui. Someone could help me ?

Have it on requirejs config

shim: {
  jqueryui: {
    "deps": ['jquery']
  },

Have you defined shim for jQuery UI? Please post the requirejs config. — T J
– T J, Commented Jul 4, 2016 at 7:15
jQuery Ui doesn't really export anything, so it's better to add it as the last. Maybe the path is wrong or something? BTW what version of jQuery UI are you using? — T J
– T J, Commented Jul 4, 2016 at 7:35
@nEJVI There's no such thing? latest version is like ~1.11.0..? — T J
– T J, Commented Jul 4, 2016 at 7:51

T J · Accepted Answer · 2016-07-04 08:20:29Z

0

The code you shared has syntax errors, you're not closing the dependency array.

jQuery UI supports AMD from version 1.11.0. Here's a guide for using it with AMD loaders.

So if you're using the latest versions then remove the shim from configuration.

also note that jqueryui in your module will be undefined since it doesn't export anything, so it's better to add such things at the end of dependencies like:

define([
  'jquery',
  'underscore',
  'backbone',
  'api',
  'text!' + versions.getVersionedPath('templates/form.html'),
  'jqueryui'],
function ($, _, Backbone, Api, Form) {});

answered Jul 4, 2016 at 8:20

T J

43.2k13 gold badges87 silver badges142 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using jQuery UI Dialog with Backbone.js and RequireJS [duplicate]

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related