Kevin, when you mentioned:
"On a side note, I noticed at one point you had a part and inside the
part you used an external variable @img... you can't do that."
The partial call was:
<%= render :partial => 'photos/mainphoto'%>
which referenced the partial:
<%= (@photo == nil) ? '<img src="/images/main_tmp_display.jpg" />' :
(image_tag @photo.mainimg.url) %>
When first loaded @photo is nil, which is desired. However, when
object is created, the photos_controller method:
def create
@photo = Photo.create!(params[:photo])
respond_to do |format|
format.js
end
end
creates instance, and the create.rjs file:
page.replace_html :imgmain, :partial => 'mainphoto', :object =>
@photo
...passes instance to the partial. This does work as expected. Just
no picture uploaded
due to XMLHttpRequest not handling type 'file'.
Cheers,
Jet
On Sep 2, 11:04 am, blueHandTalking <[email protected]> wrote:
> Thanks for reply Kevin.
>
> I have discovered the answer to this in an old post in which
> 'adamski' and Tom discussed this issue. Here is the quote from Tom:
>
> /*******************************************************/
>
> [Hobo Users] Re: getting error from update form on edge hobo
>
> Tom Locke
> Thu, 27 Nov 2008 12:46:07 -0800
>
> Oh hang on a minute - I just twigged what was going on. <input
> type="file"> doesn't work with XMLHttpRequest.
>
> To do ajax image uploaders you need a completely different approach.
> YUI has some support for this. You can see an example in the hobo
> cookbook source code.
>
> Tom
>
> /*******************************************************/
>
> It is impossible to do in the way I was approaching it.
>
> So if you or anyone knows WHERE in source code the example is that
> would be helpful. Also, I do not know what 'YUI' is, so any info on
> that would
> be helpful too.
>
> Cheers,
>
> Jet
>
> On Sep 2, 10:33 am, kevinpfromnm <[email protected]> wrote:
>
> > I'm wondering if the ajax updater handles the multipart encoding
> > properly... I haven't tried it myself.
>
> > On a side note, I noticed at one point you had a part and inside the
> > part you used an external variable @img... you can't do that. You
> > don't have the exact same context as when the page is first rendered.
> > You need to use the 'this' context as that's the only thing passed.
> > Also, no attributes from the tag or variables defined outside the
> > part.
>
> > On Sep 2, 11:18 am, blueHandTalking <[email protected]> wrote:
>
> > > From the Hobo Cookbook, description of
> > > "Using parts on repeated elements" by Tom:
>
> > > /***************************/
>
> > > The basics
>
> > > Hobo’s part mechanism makes it very easy to have parts of the page
> > > updates “ajax” style. All you do is add the part attribute to a tag
> > > somewhere:
>
> > > <div part="my-part">
> > > ... this section can be updated without reloading the page
> > > </div>
>
> > > Then use the update attribute, which is supported by various Rapid
> > > tags, invcluding <form>
>
> > > <form update="my-part"> ... <submit label="Go!"/></form>
>
> > > The presence of the update tells Rapid to generate an ajax form. When
> > > the use clicks that “Go!” button, the form is submitted in the
> > > background, the content “my-part” is re-rendered on the server, and
> > > the new content is placed onto the page.
>
> > > /***************************************/
>
> > > The above is definitely not working as described. There should be a
> > > more complete description of what is necessary to make
> > > this work. In fact, if I use
>
> > > update="my-part"
>
> > > as described above in the Cookbook, my part does not get updated. If I
> > > have
>
> > > <div id="mydiv" part="my-part">
>
> > > and then
>
> > > <form update="mydiv">
>
> > > my form does get updated. So either I have something quirky going on,
> > > or the documentation example I quoted should
> > > be changed.
>
> > > Cheers,
>
> > > Jet
>
> > > Cheers,
>
> > > Jet
>
> > > On Sep 2, 12:50 am, blueHandTalking <[email protected]> wrote:
>
> > > > Code generated by the 2 forms:
>
> > > > BELOW IS FORM WITH AJAX---update="imgmain":
>
> > > > <form action="/photos"
> > > > class="new photo"
> > > > enctype="multipart/form-data"
> > > > method="post"
> > > > onsubmit="Hobo.ajaxRequest(this, ['imgmain']); return false;">
>
> > > > <div class="hidden-fields">
> > > > <input id="page_path" name="page_path" type="hidden"
> > > > value="projects/new" />
> > > > <input name="authenticity_token" type="hidden" value="gA7U/
> > > > n2koCKgZxpPdJrQtQgeCwZXwu2m7hPnEZ++JYE=" />
> > > > <input id="photo_user_id" name="photo[user_id]" type="hidden"
> > > > value="14" />
> > > > </div>
> > > > <table class="field-list">
> > > > <tr>
> > > > <th class="mainimg-label">
> > > > Mainimg
> > > > </th>
> > > > <td class="mainimg-view">
> > > > <input class="mainimg-tag paperclip--attachment photo-
> > > > mainimg" id="photo_mainimg" name="photo[mainimg]" type="file" />
> > > > </td>
> > > > </tr>
> > > > </table>
> > > > <div class="actions">
> > > > <input class="button submit-button" type="submit" value="Save" />
> > > > </div>
> > > > <input name="after_submit" type="hidden" value="stay-here" />
> > > > </form>
>
> > > > The above does not save the image file, only a null object. Paperclip
> > > > does
> > > > not confirm the image was saved
>
> > > > BELOW IS FORM WITHOUT AJAX:
>
> > > > <form action="/photos"
> > > > class="new photo"
> > > > enctype="multipart/form-data"
> > > > method="post">
>
> > > > <div class="hidden-fields">
> > > > <input id="page_path" name="page_path" type="hidden"
> > > > value="projects/new" />
> > > > <input name="authenticity_token" type="hidden" value="gA7U/
> > > > n2koCKgZxpPdJrQtQgeCwZXwu2m7hPnEZ++JYE=" />
> > > > <input id="photo_user_id" name="photo[user_id]" type="hidden"
> > > > value="14" />
> > > > </div>
> > > > <table class="field-list">
> > > > <tr>
> > > > <th class="mainimg-label">
> > > > Mainimg
> > > > </th>
> > > > <td class="mainimg-view">
> > > > <input class="mainimg-tag paperclip--attachment photo-mainimg"
> > > > id="photo_mainimg" name="photo[mainimg]" type="file" />
> > > > </td>
> > > > </tr>
> > > > </table>
> > > > <div class="actions">
> > > > <input class="button submit-button" type="submit" value="Save" />
> > > > </div>
> > > > <input name="after_submit" type="hidden" value="stay-here" />
> > > > </form>
>
> > > > The above correctly saves the image file. Paperclip confirms the image
> > > > file was saved.
>
> > > > As you can see, they are identical except for:
>
> > > > onsubmit="Hobo.ajaxRequest(this, ['imgmain']); return false;"
>
> > > > So why is the above Hobo.ajaxRequest not reading the data from:
>
> > > > <input class="mainimg-tag paperclip--attachment photo-mainimg"
> > > > id="photo_mainimg" name="photo[mainimg]" type="file" />
>
> > > > ?
>
> > > > The object is saved, but with Null fields, so for some reason the file
> > > > input field is empty when submitted with the
> > > > Hobo.ajaxRequest.
>
> > > > If this is really a bug, I would be interested in hearing alternate
> > > > solutions on updating my partial with the image file
> > > > that has just been uploaded. I have made a couple attempts, but they
> > > > broke the image file being saved.
>
> > > > Thanks for looking at this.
>
> > > > Cheers,
> > > > Jet
>
> > > > On Sep 1, 6:57 pm, blueHandTalking <[email protected]> wrote:
>
> > > > > I am getting back to an earlier post:
>
> > > > > "Understanding the Hobo <form>
>
> > > > > In that I mentioned being unable to get a form to post to the database
> > > > > when update is used with a Paperclip attachment. I am using the
> > > > > paperclip
> > > > > plugin and the paperclip_with_hobo plugin.
>
> > > > > When I use this form:
>
> > > > > <form with="&[email protected]" >
> > > > > <field-list: fields="mainimg" />
> > > > > <actions: />
> > > > > </form>
>
> > > > > The image is saved to the database, and I stay on the current page,
> > > > > because I have <after-submit stay-here /> in my form:
>
> > > > > <def tag="form" for="Photo">
> > > > > <form merge multipart param="default">
> > > > > param="photo-object"/> -->
> > > > > <error-messages param/>
> > > > > <field-list fields="mainimg,lwrimg,uprimg" param/>
> > > > > <div param="actions">
> > > > > <submit label="Save" param/> <!--<or-cancel
> > > > > param="cancel"/> --
>
> > > > > </div>
> > > > > <after-submit stay-here />
> > > > > </form>
> > > > > </def>
>
> > > > > I am trying to upload an image file and save it to d.b., and then load
> > > > > that image into a <div>
> > > > > on the page:
>
> > > > > <div id="imgmain" part="photomain">
> > > > > <%= render :partial => 'photos/mainphoto'%>
> > > > > </div>
>
> > > > > This is the partial:
>
> > > > > <%= (@photo == nil) ? '<img src="/images/main_tmp_display.jpg" />' :
> > > > > image_tag @photo.mainimg.url %>
>
> > > > > The syntax must be wrong for
>
> > > > > image_tag @photo.mainimg.url
>
> > > > > because it generates an error. I could use help on that.
>
> > > > > But back to the form issue, if I change the form to:
>
> > > > > <form with="&[email protected]" update="imgmain" >
> > > > > <field-list: fields="mainimg" />
> > > > > <actions: />
> > > > > </form>
>
> > > > > The image file does not get saved to the database.
> > > > > I appreciate the suggestions from Kevin and Bryan,
> > > > > but the examples you mentioned were not photos.
> > > > > Text updating does work. It appears that images do not.
> > > > > I believe that something is broken in regard to saving images,
> > > > > or there is some information I have missed. However, in the
>
> > > > > Notice that I am passing an instance of @project.photo to the form.
> > > > > I am creating that in the project controller. The form without the
> > > > > 'update' correctly saves the photo, but the form with update does not.
> > > > > Do I need to pass the @project.photo instance in the params hash?
>
> > > > > I am now using a dynamic <div> with a partial, so that would satisfy
> > > > > the
> > > > > condition Kevin mentioned about the content being static.
>
> > > > > What I am really looking for is a solution. If update is broken with
> > > > > images,
> > > > > what are some suggestions for an alternative? I have tried an rjs
> > > > > approach,
> > > > > but get directed to a 'photo' page instead of reloading the 'projects/
> > > > > new' page.
>
> > > > > If anyone has example or has been successful in uploading an image,
>
> ...
>
> read more »
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Hobo
Users" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/hobousers?hl=en
-~----------~----~----~----~------~----~------~--~---
