Question

I’ve checked out the button docs and haven’t found exactly what I’m looking for.

I just generated a new jquery.ui script/css so that the fileupload I’m using will use the same theme as my site.

Here’s the HTML

<div id="fileupload">
<form action="/Webservices/FileTransferHandler.ashx" method="post" enctype="multipart/form-data">
    <div class="fileupload-buttonbar">
        <label class="fileinput-button">
            <span>Add files...</span>
            <input type="file" name="files[]" multiple="multiple" />
        </label>
        <button type="button" class="delete button">Delete all files</button>
        <div class="fileupload-progressbar"></div>
    </div>
</form>
<div class="fileupload-content">
    <table class="files"></table>
</div>

And the Jquery that’s throwing an exception

_initFileUploadButtonBar: function () {
        var fileUploadButtonBar = this.element.find('.fileupload-buttonbar'),
            filesList = this.element.find('.files'),
            ns = this.options.namespace;
        fileUploadButtonBar
            .addClass('ui-widget-header ui-corner-top');
        this.element.find('.fileinput-button').each(function () {
            var fileInput = $(this).find('input:file').detach();
            $(this).button({icons: {primary: 'ui-icon-plusthick'}})
                .append(fileInput);
        });

And here’s the exception that happens on the .button() call: Uncaught TypeError: Object [object Object] has no method ‘button’

Any ideas? Can you not call .button() on a label now? The Jquery UI version changed from 1.8.13 to 1.8.22 on my theme change and jquery went from 1.6.1 to 1.7.2

Thanks!

Answer 1

Utkanos had the right answer, I’m just repeating here to mark the question as closed.

I the .button method wasn’t being declared and I needed to make sure to include jquery.ui.button.js also in with the UI package.