Use the Reqesthandler isajax method.

- S
On 29 Sep 2011 12:35, "[email protected]" <
[email protected]> wrote:
> Hey Paul, thanks for the useful info :)
>
> I'm new so it's all a bit confusing but thanks for pointing me to the
> RequestHandler which I've never used before. Handling Ajax requests...
> hummm... wha?!? Some reading ahead of me today I think!
>
> I've tried jQuery UI's modal box which worked great - in fact as well
> as reading up about RequestHandler I was going to try to compare the
> two modals and see why one works and one doesn't - but I didn't like
> the themes. NyroModal just looks nice and plain and simple. I might
> have to go back and just use it if I can't figure things out. Why
> would the form work in a UI modal and not a Nyro Modal !?! grrrr..
> does it handle ajax requests automatically?
>
> thanks
> Sarah
>
> On Sep 29, 8:23 am, WebbedIT <[email protected]> wrote:
>> Sarah,ut
>> I've
>> This is not a CakePHP issue, this is related to a jQuery plugin that I
>> don't think there is a CakePHP helper for (may find one somewhere but
>> never heard of the plugin myself).
>>
>> However, let's try and get you on the right path.  It's one thing to
>> open a modal that contains a form, which it seems you're managing to
>> do, but you then need to ensure that the form within the modal is
>> being submitted as an AJAX request that updates the modal rather than
>> loading a new page.
>>
>> I am not familiar with NyroModal so can't give specific help on that
>> jQuery Plugin.  I've had a quick look at the plugin's documentation
>> and I found the demos very hard to follow:http://nyromodal.nyrodev.com/
>>
>> However, I think you simply need to add class='nyroModal' to your form
>> tag and it will submit the form as an ajax request, but you need to
>> make sure Cake is then able to handle the AJAX request properly and
>> send it back without the default layout and debug messages etc.  I
>> reccomend using the RequestHandler component to check if a request to
>> the controller/action isAjax and then set the layout to 'ajax' which
>> will probably just contain <?php echo $content_for_layout; ?>.  I also
>> strongly reccomend using FireBug when working with AJAX so you can see
>> if your requests are being fired, what they sent and what they
>> returned.
>>
>> Why did you chose NyroModal over jQuery UI's excellent native 'dialog'
>> which creates modals that are themeable?  I use these all the time and
>> find the documentation to be spot on.
http://jqueryui.com/demos/dialog/#modal-form
>>
>> HTH, Paul
>>
>> On Sep 28, 6:01 pm, "[email protected]"
>>
>>
>>
>> <[email protected]> wrote:
>> > Hi Mike, I really really appreciate your help with this but I've been
>> > fiddling about and trying to understand what you've told me but I'm
>> > still a little bit unsure. I'm really new to JS and not too sure what
>> > bits go where.
>>
>> > Heres what I have in my JS file for this page:
>> > $(function() {
>> >   $('.nyroModal').nyroModal();
>>
>> > });
>>
>> > As far as I know that is meant to mean that when someone clicks a link
>> > with the class="nyroModal" the modal pop up should appear (which it
>> > does:)
>>
>> > Here's what I have to open the modal:
>> > <a href="#test" class="nyroModal"><?php echo
$this->Html->image('uploadimage.gif');?></a>
>>
>> >         <div id="test" style="display: none; width: 600px;">  <?php
>> >                 echo $form->create('Image', array('action'=>'upload',
'type' =>
>> > 'file'));
>> >                 echo $form->input('fileName', array('type' => 'file'));
>> >                 echo $form->end('Upload');?>
>> >         </div>
>>
>> > What bits do you mean I should be changing?
>>
>> > thanks ;)
>>
>> > On Sep 28, 3:41 pm, mike karthauser <[email protected]> wrote:
>>
>> > > Hi Sarah
>>
>> > > On 28 Sep 2011, at 15:05, [email protected] wrote:
>>
>> > > > I'm learning all about cakephp but having an issue which I can't
>> > > > figure out. I'm trying to have a file upload form inside a modal
box,
>> > > > but although the form works fine when not in a modal box and just
in a
>> > > > ctp file, when it's in the modal box it doesn't submit at all.
>>
>> > > > I'm using Uploader by Miles Johnsonhttp://
milesj.me/code/cakephp/uploader#script
>> > > > and the modal box is fromhttp://nyromodal.nyrodev.com/
>>
>> > > > The code I'm using to create the form is:
>> > > > <a href="#test" class="nyroModal"><?php echo $this->Html-
>> > > >> image('uploadimage.gif');?></a>
>> > > > <div id="test" style="display: none; width: 600px;">    <?php
>> > > >    echo $form->create('Image', array('action'=>'upload', 'type' =>
>> > > > 'file'));
>> > > >    echo $form->input('fileName', array('type' => 'file'));
>> > > >    echo $form->end('Upload');
>> > > > </div>
>>
>> > > > When I click the image the modal box pops up as expected with the
form
>> > > > inside just like it's meant to be. But when I click submit nothing
>> > > > happens.
>>
>> > > > Like I said, the exact same form works outside the modal box. Plus
the
>> > > > outputted code appears the same:
>> > > > <form id="ImageUploadForm" enctype="multipart/form-data"
method="post"
>> > > > action="/sponster/images/upload" accept-charset="utf-8">
>> > > >    <div style="display:none;">
>> > > >        <input type="hidden" name="_method" value="POST" />
>> > > >    </div>
>> > > >    <div class="input file">
>> > > >        <label for="ImageFileName">File Name</label>
>> > > >        <input type="file" name="data[Image][fileName]"
>> > > > id="ImageFileName" />
>> > > >    </div>
>> > > >    <div class="submit"><input type="submit" value="Upload" />
>> > > >    </div>
>> > > > </form>
>>
>> > > > I've obviously missed something stupid or something? Can anyone
help
>> > > > me please?
>>
>> > > I suspect your js trying to do something like
$('#ImageUploadForm').submit(function(){
>>
>> > > // do something
>>
>> > > };
>>
>> > > this is fine in outside the modal as the form loads before the
document is ready so js can hang an event off the dom object. When you load
this in a modal, the js isnt aware of the object so no event can be
triggered.
>>
>> > > A way round this is to use the .live event handler in jquery.
>>
>> > > $('#ImageUploadForm').live('submit',function(){
>>
>> > > // do something
>>
>> > > };
>>
>> > > Also if your js is being loaded as part of your view, then its likely
that in the modal its not being loaded at all. use firebug to check this. if
its not loading, stick it in your main template.
>>
>> > > Hopefully it'll be something like this.
>>
>> > > mikek
>>
>> > > --
>> > > Mike Karthäuser
>> > > Managing Director - Brightstorm Ltd
>> > > Email: [email protected]
>> > > Web:http://www.brightstorm.co.uk
>> > > Tel: 07939 252144
>> > > Address: 1 Brewery Court, North Street, Bristol, BS3 1JS
>
> --
> Our newest site for the community: CakePHP Video Tutorials
http://tv.cakephp.org
> Check out the new CakePHP Questions site http://ask.cakephp.org and help
others with their CakePHP related questions.
>
>
> To unsubscribe from this group, send email to
> [email protected] For more options, visit this group
at http://groups.google.com/group/cake-php

-- 
Our newest site for the community: CakePHP Video Tutorials 
http://tv.cakephp.org 
Check out the new CakePHP Questions site http://ask.cakephp.org and help others 
with their CakePHP related questions.


To unsubscribe from this group, send email to
[email protected] For more options, visit this group at 
http://groups.google.com/group/cake-php

Reply via email to