Codeigniter + Redactor (wysiwyg js editor). Image uploading - codeigniter

I trying to integrate wysiwyg editor Redactor in Codeigniter website.
RedactorOptions:
{
lang: lang(),
toolbarFixed: true,
buttons: ['html', '|', 'bold', 'italic', 'deleted', '|', 'image', 'video', '|', 'unorderedlist', 'orderedlist', '|', 'alignment', '|', 'horizontalrule', '|', 'table', '|', 'mtLink'],
imageUpload: '/upload_photo'
}
while I start to send photo through Upload Image Dialog, I see in Developer console:
Uncaught TypeError: Cannot read property '0' of null redactor.js:1
Redactor.(anonymous function).$.(anonymous function).(anonymous function).uploadLoaded redactor.js:1
p.isFunction.f jquery.js:2
p.event.dispatch jquery.js:2
g.handle.h
Script "upload_photo" is running, but $_FILES is empty.
What wrong and how I can to fix it?
Thank in advance.

I have been fumbling around all night trying to fix this same issue, and it turns out to be a simple over site (so give your self a slap like I gave my self one!)
You have CI Cross-site request forgery (CSRF) protection set to TRUE in your config. Redactor is getting that nasty error page you see when you submit a form with out refreshing an old page (I really want to find a fix for that)!
The CSRF token has to be passed in any form that is submitted by POST. This gets done automatically when using CI's form_open(), but Redactor is using it's own form to do the post. So you need to include the CSRF info like this.
uploadFields: {
<?php echo $this->security->get_csrf_token_name(); ?>: '<?php echo $this->security->get_csrf_hash(); ?>'
}
I'm pretty sure that's your problem. It was mine (thumps self in head - again).

CI's file upload class will look for POST data from input field named 'userfile' by default. The file input field of redactor is named 'file'. So you need to stipulate this name in your upload script by changing $this->upload->do_upload() to $this->upload->do_upload('file').
If this isn't the problem you will need to include your upload code here so I can see what's going on.

Related

ExtJS + Spring: Unable to receive PDF in browser after Ajax call

I am using Spring + ExtJS and need to 'export to' functionality on UI screen. I am making an Ajax call and sending the data in JSON format to controller. In controller I am doing all stuff to generate the PDF using iText and it does generate the document.
Now I am not seeing the generated PDF to downlaod/view in browser. If I do it without Ajax call, it works. Not sure whats making the difference.
I read few related articles around this which suggested to use below :
Content-type: application/pdf
Content-Disposition: attachment; filename="FileName.pdf"
But no luck with this. Please advice on this/let me know if going wrong.
As mentioned here and here, you can use an hidden iframe to do this.
Personnally I prefer the hidden form posting solution, here is an example :
var formEl = Ext.DomHelper.append(document.body, {
tag: 'form',
css : 'display:none;',
id: 'downloadForm'
}, true);
var form = new Ext.form.BasicForm(formEl, {
url : [your spring controller url],
method : 'POST',
fileUpload: true,
baseParams: [your JSON parameters]|| {}
});
form.doAction(new Ext.form.action.StandardSubmit({
form: form,
clientValidation: false
}));
I hope this helps.

Enable html in joomla editor

In one of my joomla custom form, I am rendering an editor as follows
<?php
$qu=$question ? $question : '';
$editor = JFactory::getEditor();
echo $editor->display('question', $qu, '100%', '400', '80', '15');
?>
The editor was working fine But when I am trying to submit after formatting, its html part won't get sumitted. If the editor was loading from xml filter="safehtml" or filter="raw" will work. But how to enable html in this case ?
Please help
Thanks in advance
The problem lies in JRequest::GET which by default strips all html.
You have to ask specifically the input you want html from.
JRequest::getVar( 'yourfieldname', '', 'post', 'string', JREQUEST_ALLOWHTML );
Joomla Docs

Rails 3 MarkItUp Preview

So I've implemented the Markitup bbcode editor in my Rails application and I'm currently attempting to get the preview functionality working. I followed a 4 year-old blog entry install markitup! in Ruby on Rails which got me pretty close to what I need to do. So far, when I press the preview button it renders an iframe that displays a blank template for me.
In my jquery.markitup.js I have this line as one of the options:
previewTemplatePath: '/templates/preview',
Which will make an ajax request to retrieve the page for the route:
resources :templates do
collection do
get :preview
end
end
Currently the preview action simply sets render :layout => false so I don't duplicate html. As for the preview.html.erb page itself I simply have:
<%= bb(params[:data]) %>
And the idea behind this is to send the markup entered in the editor into the params data hash and then pass that through my bb code helper which does the parsing and returns some html.
The Problem
I don't know how to fill that params[:data] with the bb code entered into the markitup editor. Does anybody know how I can send that off?
Extra details:
I thought I would include all the options I'm passing off to markItUp:
options = { id: '',
nameSpace: '',
root: '',
previewInWindow: '', // 'width=800, height=600, resizable=yes, scrollbars=yes'
previewAutoRefresh: true,
previewPosition: 'after',
previewTemplatePath: '/templates/preview',
previewParser: false,
previewParserPath: '',
previewParserVar: 'data',
resizeHandle: true,
beforeInsert: '',
afterInsert: '',
onEnter: {},
onShiftEnter: {},
onCtrlEnter: {},
onTab: {},
markupSet: [ { /* set */ } ]
};
The previewTemplatePath and the previewParserPath options needed to be set when I make the call to markItUp!.
The previewTemplatePath points to the view that displays the rendered preview and the previewParserPath is meant to point to your controller action that handles the parsing and data parameter. Assuming you're following dry conventions both paths should be the same as it was in my case.
For a better look at how to integrate markItUp! with rails check out the source for branch14's markupitup gem.

Uploading Image Using JQuery And Django

Before you continue reading, trust me when I say I have read all the other posts on this subject, and none of them helped.
I am trying to add image upload functionality to my website. I want to upload the image
via an ajax post. I cannot get this working.
Here is what I have:
HTML - i have a special setup so that an image is displayed instead of a stupid button
and the text field. I am also using the onChange event to automatically submit when I have hit "OK" after selecting the image.
<form id="add-picture-form" method="POST" action="/api/upload_image/" enctype="multipart/form-data">{% csrf_token %}
<div class="thumbnails" style="width:400px;">
<label class="cabinet BrandHeader">
<input type="file" class="file" id="upload-photo" onChange="$('#add-picture-form').submit();" />
</label>
</div>
</form>
Jquery:
$('#add-picture-form').submit(function() {
//var filename = $("#upload-photo").val();
var photo = document.getElementById("upload-photo");
var file = photo.files[0];
$.ajax({
type: "POST",
url: "/api/upload_image/",
enctype: 'multipart/form-data',
data: {'file': file.getAsBinary(), 'fname' : file.fileName },
success: function(){
alert( "Data Uploaded: ");
}
});
return false;
});
Finally my django view that is hit when you post to /api/upload_image/
def ajax_upload( request ):
print request.POST
print request.FILES
return http.HttpResponse(simplejson.dumps([True]), mimetype='application/javascript')
I have tried to write the image to binary, but I cannot open that data that has written.
Why is uploading an image using javascript so hard? I am an idiot and just not using a simple solution? If so, please tell me what is the best way to use jQuery to upload an image in Django.
Try the jQuery plugins Uploadify or SWFUpload. Someone even did the Django integration for you, see: https://github.com/tstone/django-uploadify and http://blog.fogtunes.com/2009/11/howto-integrate-swfupload-with-django/.
I'm not that familiar with django but I think the issue is that uploading a file via AJAX isn't as simple as you might think.
There are several methods of getting around this, but I recommend using one that already exists. Since you are using jquery, I would recommend the jquery forms plugin: http://jquery.malsup.com/form/#getting-started
The plugin supports file uploading out of the box, and really all you'll need to do is wire it up to your form:
$('#add-picture-form').ajaxForm();
see also: How can I upload files asynchronously?

cakephp updating elements

I have an index view which has some elements on it .
index controller code;
$userID = $this->Authsome->get('id');
$qnotes = $this->Qnote->getnotes($userID);
$this->set('qnotes', $qnotes)
$this->render();
elements have been added to the page using
index view code
<?php echo $this->element('lsidebar'); ?>
now the Issue is I also Have an add controller.
add controller code
function add() {
if(!empty($this->data)) {
unset($this->Qnote->Step->validate['qnote_id']);
$this->Qnote->saveAll($this->data);
$this->Session->setFlash('New Note Template has been added.','flash_normal');
}
}
now what I am trying to achieve is once I add a Qnote i want the element('lsidebar') updated
for the new Qnote.
I am Using the Ajax helper. found at http://www.cakephp.bee.pl/
also Here the add qnote View Code :
<?php echo $ajax->submit(
'Submit', array(
'url' => array(
'controller'=>'qnotes',
'action'=>'add')
));
I know its sound like a noob question . can Somebody point me in the right direction atleast.
I have tried everything i could think off. I bet the solution something easy which i didnt think off
help :)
If you want to dynamically update a sidebar with information that is submitted via ajax, there should be a "success" option in your ajax post that would allow you to fire a specific javascript action when the post is finished (or succeeds). You should write a small javascript ajax function to reload the contents of your sidebar when the post succeeds.
See this other stackoverflow answer: CakePHP ajax form submit before and complete will not work for displaying animated gif

Resources