Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We're retiring the forums!

The SilverStripe forums have passed their heyday. They'll stick around, but will be read only. We'd encourage you to get involved in the community via the following channels instead:

All other Modules /

Discuss all other Modules here.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

Uploadify + jQuery Form plugin


Go to End


2 Posts   1939 Views

Avatar
ec8or

Community Member, 18 Posts

30 September 2011 at 6:27am

I am using the uploadify module on a frontend form and everything works fine except that I've run in to some problems submitting the form via ajax (the form is in a modal and I can't really refresh the whole page).

With the images being uploaded on selection it works fine to then submit the form using ajaxForm() but if I set the uploadOnSubmit parameter on the MultipleFileUploadField the form is submitted to a blank page instead.

Form code:

    function __construct($controller, $name) {
        $fields = new FieldSet(
            $images = new MultipleFileUploadField('Images', _t('UploadForm.IMAGES', 'Images'))
        );
        $actions = new FieldSet(
            new FormAction('doupload', _t('UploadForm.UPLOAD', "Upload"))
        );
        $images->setFileTypes(array(
            'png',
            'gif',
            'bmp',
            'jpg',
            'jpeg'
        ));
        //$images->uploadOnSubmit();
        parent::__construct($controller, $name, $fields, $actions);
    }
    public function doupload($data, $form) {
        $memberID = Member::currentUserID();
        if(isset($data['Images']) && is_array($data['Images'])) {
            foreach($data['Images'] as $id) {
                if($file = DataObject::get_by_id("File", (int) $id)) {
                    $bookImage = new BookImage();
                    $bookImage->ImageID = $file->ID;
                    $bookImage->MemberID = $memberID;
                    $bookImage->write();
                }
            }
        }
        $response['success'] = True;
        $response['message'] = _t('CartController.UPLOADSUCCESS', 'Your upload was successful!');
    }

Javascript:

        $('#UploadForm_UploadForm').ajaxForm({ 
            dataType: 'json',
            success: function(data) { 
                var url = window.location.pathname + '/show_mygallery';
                $('#ImageList').load(url, function() {
                    // Clear uploadify form
                    $('#UploadForm_UploadForm .inputs input').remove();
                    $('#UploadForm_UploadForm .upload_previews li').remove();
                });
            }
        }); 

and here is the code in uploadify_init.js that submits the form by-passing the ajaxForm binding, line 61:

				onAllComplete : function(event) {
					$e = $(event.currentTarget);
					$e.data('active',false);
					$e.parents('form').find(':submit').attr('disabled',false).removeClass('disabled');
					$container = $e.parents('.UploadifyField:first');
					$('.preview',$container).show();
					if($e.metadata().upload_on_submit) {
						$e.parents('form').submit();
					}

				},

Am I missing something or is there a better way to go about this?

Cheers

Avatar
ec8or

Community Member, 18 Posts

30 September 2011 at 6:29am

sspaste with better formatting: http://www.sspaste.com/paste/show/4e84b2e24d593