django-summernote WYSIWYG editor: mixing modelForm and model, problem with Images

[hemulin]

(noob warning)

I wanted to use summernote within a model but without using the default modelForm.
I ended up mixing the two like this (can't have widgets on model field...):

In models I have

class Article(models.Model):
 """Represents a wiki article"""
 title = models.CharField(max_length=100)
 slug = models.SlugField(max_length=50, unique=True)
 text = models.TextField()
 author = models.ForeignKey(User)
 created_on = models.DateTimeField(auto_now_add=True)
 objects = models.Manager()
 tags = TaggableManager(through=TaggedArticle)

class ArticleForm(forms.ModelForm):
 class Meta:
  model = Article
  fields = ['text']
  widgets = {
    'text': SummernoteWidget(),
  }

After having the right display while serving the template, I attempt to save the Article like this:

in views, a part of the saving method:

form = ArticleForm(request.POST or None)
if form.is_valid():
    #import pdb; pdb.set_trace()
    article = Article()
    article.text = form.cleaned_data['text'] # THIS IS MY HACKISH WAY OF FETCHING THE CONTENT
    article.author = request.user
    article.title = request.POST['title']
    article.save()
    if request.POST.has_key('tags'): #add relevant ones
      article_tags = request.POST.getlist('tags')
      article_tags = [tag for tag in article_tags]
      article.tags.add(*article_tags)    
    return HttpResponse("Article saved successfully")

1) I have everything configured (MEDIA_ROOT, MEDIA_URL, summernote url as described in the setup)
2) The widget is displayed well within iframe
3) When uploading an image I get the "mime interpreted as text blah blah blah" error
4) After saving, when displaying the article, the text is displayed well with all the markup but no image is displayed
5) For every image I try to add to an article, the image appear in django-summernote/<date-of-upload>/<some-hash-string>.<image-extension>

Finally, how would you suggest me to solve the problem and having the images uploaded and displayed correctly in the resulted article text?

Cheers.

[James Schneider]

Can you post the full error you're receiving? The 'blah blah blah' is probably the most important. A mention of MIME types likely means that the image is not uploading correctly. Can you actually find the image on the server? Or a record of it in the database?

-James

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at http://groups.google.com/group/django-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/1d2c3458-2275-48c8-b9b8-bc9ccbcb5e57%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[hemulin]

Hi,

not sure what I've done but I don't get the error anymore, instead I got nothing. No error, no image in the preview and no image after the saving and displaying the article.

To your questions, yes and yes. I can find the image in the server (under static/media/django-summernote/<date-of-upload>), and I can find the image in the DB.

Interestingly, while using the "load image from URL" option in the summernote dialog, the url is inserted well, both in the preview and in the displayed article (<img> tag with the url src in the right place in form.cleaned_data['text']).

Evidently the problem exists only when uploading a local image. Which leads me to the assumption that there is a problem with my media settings...

What I have is this:

STATIC_URL = '/static/'

MEDIA_ROOT = os.path.join(PROJECT_PATH, "static", "media")

MEDIA_URL = "media/"

url(r'^media/(?P<path>.*)$', 'django.views.static.serve', {

            'document_root': settings.MEDIA_ROOT, 'show_indexes': True

        }),

I can access the uploaded images via 'media/' and browsing through the folders, so I thought it's set up well, no I'm not so sure.

Any idea what's going on here?

[James Schneider]

Have you validated that the URL being generated in the final HTML (the source HTML in the browser) is pointing to the right location? If not, I would tend to agree with your assertion that the media settings need tweaking.

-James

To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/de7c9520-c772-4b4b-9932-b5da56c621a9%40googlegroups.com.

[hemulin]

I'm not sure I understood your question.
If by "final HTML" you mean the rendered template which displays the article, then there's nothing interesting here. I'm just passing the article in the context to the template and in the template assigning in various tags the relevant content ({% article.title %}, {% article.text %}, etc.)

I'm more concerned (or lets say, suspicious) that even after the image dialog is closed (and the upload request is being processed and returned '200 ok', and the file is on the server) the image is not shown in the summernote editor.

Does the settings looks ok to you?

[James Schneider]

Sorry about that. What I meant was what do the URL's look like after the template rendering completes (ie what does the browser see as the value for your <img src="<url>"> tags). Since it is breaking while editing the document, that question is now moot.

Your media settings are probably OK (however I'm smashing together paths in my head, so I can't say for sure), but you'll need to verify that summernote is properly generating the URL's. After uploading the photo, you should see the 200 response for the file upload request. I then assume that another piece of JS fires off to pull down the image that was just uploaded so that it can be displayed in the editor. Do you immediately see another GET request after the file upload for the image file completes? If so, does the URL that is being requested appear correct, and if so, what is the server response? If you are receiving a 200 response to pull down the picture, or if you can manually copy/paste that image path in another browser tab and pull down the picture yourself, then there is something going on with the Summernote JS and you'll need to take that up with them. If it is using the wrong URL, then you should check the upload settings within Summernote (seems like there are a fair number of them), and if that fails to bear any fruit, you'll probably need to open a request with them on how to troubleshoot.

Given that you can see the files on the server via the browser manually, and the uploader appears to be working correctly, I think you can narrow down the issue to something within Summernote. I saw that you opened a ticket on GitHub with them. 

HTH,

-James

To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/07d66382-4fc2-4a9a-928e-921eda5ca8fe%40googlegroups.com.

[hemulin]

It does help.
I will continue on their github page.
Thank you for your kind help.

Best.
Hemulin