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
