1

I am using the jquery multifile plugin found here:

http://www.fyneworks.com/jquery/multiple-file-upload/

I've used it in the past and had no problems, but now I am trying to use it in a dynamically loaded form and it's causing a strange issue.

I am binding the function correctly when loading the form as per this article, so please understand this is a DIFFERENT, albeit related, problem to the one posted here:

Cannot bind input event to jQuery multifile from dynamically loaded form

$('#reportWindow').on('click', '#continueReport', function () {
    var data = $('.reportForm').serializeObject();
    $('<div/>').load('/Forms/report.aspx', data, function () {
        doReportForm(this);
    });
});

An ASPX file is being loaded into a div using jquery load as per the above, the doReportForm function is to call in various binding methods to that dynamically generated HTML as per:

function doReportForm(ele) { 
    $(ele).makeModal('', 800);
    FB.XFBML.parse();
    checkLogin();
    clearNetIds($('#reportForm2'));

    $("#datePicker").datepicker({
        changeMonth: true,
        changeYear: true
    });

    $('[class*="toolTip"]').setupTip();
    $(".multi").MultiFile(); // input[type=file]

    $('#right').on('click', '#savePost', function () {
        var data = $('.reportForm2').serializeObject();
    });
};

The first line there, $(ele).makeModal('', 800); is simply a jQuery extension I made to create modal windows, so it as it THIS point where the element is added to the DOM, then a few lines down I bind the MultiFile plugin thus $(".multi").MultiFile();

The first time this is done, it works fine. But, when a user closes the modal window and then tries to load the form again I get an error. 

Uncaught TypeError: Cannot call method 'apply' of undefined

(closing the modal window removes it completely from the DOM with jQuery.remove(), so any future windows are written completely from fresh).

After a bit of fiddling, it appears that this is due to jQuery not being able to access the MultiFile script... I think

The MultiFile script is loaded in the head of the parent document, so should be available at all times.

Community
  • 1
  • 1
Jamie Hartnoll
  • 7,231
  • 13
  • 58
  • 97
  • My first guess would be that something inside the jQuery plugin fails. Did you get the development (readable) source? `.apply` is likely called on a function, why is it `undefined`? – Halcyon Jan 04 '13 at 11:16
  • yes, `.apply` is called 4 times in the plugin, but I can't see why anything should be undefined second time round. – Jamie Hartnoll Jan 04 '13 at 11:21
  • Couldn't crack this, whatever I do, if I rebind this plugin without a page load it causes errors. I had to re-work my workflow to avoid any need to rebind. – Jamie Hartnoll Jan 06 '13 at 18:10
  • What do you mean by 'rebind'? Are you loading that plugin twice? – Halcyon Jan 07 '13 at 13:59
  • No, but each time I load my modal window I was creating new elements to which the function needs to bind `$(".multi").MultiFile();` is called. Calling this on new elements a second time causes the error. So I am now only generating the elements with JQuery once and then hiding, rather than removing them from the page when closed. – Jamie Hartnoll Jan 07 '13 at 14:21

0 Answers0