SafeCracker File with Ajax?
Posted: 06 October 2010 04:30 PM   [ Ignore ]
Wallflower
Rank
Total Posts:  11
Joined  2010-09-28

Has anyone had luck using SafeCracker File with Ajax?

Some info here - http://jquery.malsup.com/form/#file-upload

I’ve tried using the iframe paramater but I don’t seem to get an success message back.

Profile
 
 
Posted: 06 October 2010 05:53 PM   [ Ignore ]   [ # 1 ]
Teen Scream
Avatar
RankRankRank
Total Posts:  3541
Joined  2009-05-29

I sent you an updated file to try out. Just to confirm, you have json=“yes” in your entry form, right?

Profile
 
 
Posted: 07 October 2010 12:58 PM   [ Ignore ]   [ # 2 ]
Wallflower
Rank
Total Posts:  11
Joined  2010-09-28

Hi Rob,

Thanks - I updated the lib file but I’m still having issues.

I’ve tried it with the ee native and SafeCracker File.

There’s definitely an issues with missing some CSS includes so I’m thinking maybe there is some missing JS as well.

Do you have a basic template example code that you have tested where this works?

To clarify a couple of things:

In the docs you mention to include

<link href="{path=css/_ee_saef_css}" type="text/css" rel="stylesheet" media="screen" /> 

That doesn’t exist in EE 2.0. I have a look and there is a saef.css in /themes/cp_themes/default/css - but that seems to only have styles for MarkitUp.

Using SafeCracker File (which I’m using within a matrix) if I click browse I the the :

<div id="file_manager" style="width: auto; min-height: 0px; height: 477px; " class="ui-dialog-content ui-widget-content">etc</div

But none of that is styled. What is the best way to link in those required CSS files? I thought {safecracker_head} should take care of that.

If I do click browse and then try to upload a file I get:

Uncaught TypeErrorCannot call method 'upload_error' of undefined index.php?ACT=9&action=upload:

When you had this working were you using the ajaxForm code you have at the bottom of the docs or did you have to use the iframe: true paramater to get this to work?

Any help would be appreciated.

Profile
 
 
Posted: 07 October 2010 09:07 PM   [ Ignore ]   [ # 3 ]
Teen Scream
Avatar
RankRankRank
Total Posts:  3541
Joined  2009-05-29

Can you PM me a URL?

Profile
 
 
Posted: 08 October 2010 03:04 AM   [ Ignore ]   [ # 4 ]
Teen Scream
Avatar
RankRankRank
Total Posts:  3541
Joined  2009-05-29

Just FYI. I ran a test locally, with a very vanilla setup of ajaxForm, no special options, and the file submit just…worked. So I’m pretty sure whatever you’re experiencing is due to some kind of JS problem. Do you have debugging set to 1 in EE?

Profile
 
 
Posted: 10 October 2010 04:38 PM   [ Ignore ]   [ # 5 ]
Wallflower
Rank
Total Posts:  11
Joined  2010-09-28

Hi Rob,

Sorry I haven’t looked at this for a couple of days - it looks like my initial issue was related to relative file upload paths that I was using - so I’ve fixed that for the moment.

I’m not sure if you’ve come across this, but is there a function that you can call which will reload the current matrix on the page? Basically I’m using the Ajax submit method but after a file have been uploaded you have to manually reload the page to see the newly uploaded image.

Or is there a way to detect if the user has uploaded an image, so I can easily reload the form to show the newly loaded image in the callback for my ‘success’ function.

Profile
 
 
Posted: 12 October 2010 08:13 PM   [ Ignore ]   [ # 6 ]
Teen Scream
Avatar
RankRankRank
Total Posts:  3541
Joined  2009-05-29

You should re-load your entry form via ajax in your ajaxForm success function

$('publishForm').ajaxForm({
    success
: function() {
        
$('body').load('{path=site/entry_form}');
    
}
}
); 
Profile