[jQuery] Re: HowTo: Trigger error callback in ajax request
On Dec 17, 9:57 am, MorningZ morni...@gmail.com wrote: Is it a non-200 status code I can't say it's 100% of the time, but in my code it seems to be the case Ding, ding, ding. Looks like that's it. In my PHP script, this is what I did to test... try { throw new Exception ( 'Something I made up' ); } catch ( Exception $e ) { header ( 'HTTP/1.0 500 Internal Server Error', true, '500' ); echo $e-getMessage(); } My error callback picks it up nicely and reports the message in XMLHttpRequest.responseText. Thanks again.
[jQuery] HowTo: Trigger error callback in ajax request
I have an ajax request being sent to a PHP script. If that script captures an error, I'd like it to echo that error and return whatever it needs to return to trigger the error callback in my ajax call. I can't seem to find what that is. Is it a non-200 status code? Simply throwing an error (throw new Exception()) just triggers the success callback with the error text (not unexpectedly, of course). I'm using the jQuery form plugin and using the .ajaxSubmit() method, but I suspect the answer would be the same for a core .ajax() call. My simplified case looks like this: $(document).ready ( function() { $( '#CommercialVendorAddForm' ).submit ( function() { $(this).block(); $(this).ajaxSubmit ({ beforeSubmit: function() { alert ( 'validating' ); }, success: function ( responseText, responseCode ) { alert ( 'success' ); alert ( responseText ); }, error: function() { alert ( 'An error has occured. Your application could not be submitted.' ); }, complete: function() { $( '#CommercialVendorAddForm' ).unblock(); } }); return false; } ); }); I can't believe that there's not a way to force the error callback to receive the response if the server page returns an error, but what is that way? Thanks. Rob
[jQuery] Access Elements Rendered in a Thickbox
Hey all - I'm looking for/wondering whether there is a way to access an element loaded in a thickbox. I have a page that launches thickbox to load a form. I need to be able to set a click() event listener on the submit button of that form so that I can submit the form via ajax. Unfortunately, I can't come up with a clever way of doing that. Any ideas? I tried (just for the sake of eliminating the obvious) applying the event listener on document ready, but no luck, of course, since I assume that the form's submit button doesn't exist until the thickbox is loaded. Is there any way to make this happen? Thanks.
[jQuery] Re: Access Elements Rendered in a Thickbox
On Dec 16, 3:33 pm, Ricardo Tomasi ricardob...@gmail.com wrote: Your thickbox script most certainly provides a callback function where you could add those handlers, which one are you using? Hey Ricardo - I'm using http://jquery.com/demo/thickbox/. I'll dig a little deeper. I was hoping someone already knew the answer and could spare me hours. :-) Thanks.
[jQuery] Re: Selector Not Working in IE7?
On Nov 16, 1:33 pm, Rob Wilkerson [EMAIL PROTECTED] wrote: I'm trying to manually interact with the multifile plugin and, as part of that endeavor, I need to systemically access the anchor tag that provides Delete functionality. The following works great in FF (of course): $('a[href^=#multimulti_]') The objects are returned as expected and alert ( $ ('a[href^=#multimulti_]').length ) returns the expected number of elements. In IE7, though, the former value is undefined and the latter is 0. Anyone have any idea why this might be happening? For anyone who may be interested and searching, I finally tracked this down thanks to the most excellent DebugBar (http:// www.debugbar.com/). Seems that IE, in its infinite wisdom, thinks that the hrefs created by the multifile upload code aren't good enough and prepends the rest of the page URI to them at runtime. The href coded a href=#multimulti_0Delete/a, rendered in IE, is transformed into a href=http://www.mydomain.com/survey#multimulti_0;Delete/a. As a result, the attribute-begins-with selector ([attribute^=value]) doesn't work. I replaced it with the attribute-contains selector ([attribute*=value]) so that the code will work in both IE Firefox.
[jQuery] Re: Selector Not Working in IE7?
On Nov 20, 2007 5:02 PM, Josh Nathanson [EMAIL PROTECTED] wrote: WOW, thanks for that link to debugbar.com -- I had been searching far and wide for an IE debugger and couldn't find anything good -- that is sweet! It's no Firebug, but it's the best I've seen for IE.
[jQuery] Selector Not Working in IE7?
I'm trying to manually interact with the multifile plugin and, as part of that endeavor, I need to systemically access the anchor tag that provides Delete functionality. The following works great in FF (of course): $('a[href^=#multimulti_]') The objects are returned as expected and alert ( $ ('a[href^=#multimulti_]').length ) returns the expected number of elements. In IE7, though, the former value is undefined and the latter is 0. Anyone have any idea why this might be happening? A high level end-to-end process looks like this: 1. User selects a file to upload 2. File is uploaded via the ajax file upload plugin and validated 3. If an error is thrown (dimensions incorrect, file size too large, etc.), the error is displayed and the delete link is triggered so that the file is removed from the display. Any insight would be much appreciated. I don't see any indication in the jQuery docs that this type of selector shouldn't work in IE... Thanks. Rob
[jQuery] Interacting with the MultiFile Plugin
I have a form that is using both the ajaxFileUpload and the MultiFile plugins. When a user selects a file for upload, the change event uploads the file via ajax for validation. If an error occurs, I need to remove the file from the MultiFile queue. I can (and have) manually removed the elements, but that doesn't decrement the maxfile counter, of course. The easy way to do all of this is to trigger the MultiFile function that is called when the user deletes the file from the UI, but I can't figure out how to do that or, for that matter, if it's even possible. Here is a snippet from within my $.ajaxFileUpload() where I'm manually removing the UI components: success: function ( data, status ) { try { var index = /\d+$/.test ( input.name ) ? input.name.replace ( /^.+ (\d)+$/, '$1' ) : 0; /** * If there's an error in the upload process, remove the relevant * UI elements. */ if ( data['error'].length 0 ) { $('#multi_0_' + index ).remove(); $('a[href^=#multimulti_]:last').parent().remove(); /** TODO: have to decrement the counter within the MultiFile object...how? */ throw ( data['error'] ); } else { // Debug // alert ( data['files'] ); $('form').prepend ( 'input type=hidden ' + 'id=uploaded' + index + ' ' + 'name=uploaded' + index + ' ' + 'value=' + encodeURI ( data['files'] ) + ' ' + '/' ); } } catch ( e ) { alert ( 'Error: ' + e.message ); } }, Any help would be much appreciated. Thanks. Rob Wilkerson
[jQuery] Re: Interacting with the MultiFile Plugin
On Sep 17, 9:17 am, Rob Wilkerson [EMAIL PROTECTED] wrote: I have a form that is using both the ajaxFileUpload and the MultiFile plugins. When a user selects a file for upload, the change event uploads the file via ajax for validation. If an error occurs, I need to remove the file from the MultiFile queue. I can (and have) manually removed the elements, but that doesn't decrement the maxfile counter, of course. The easy way to do all of this is to trigger the MultiFile function that is called when the user deletes the file from the UI, but I can't figure out how to do that or, for that matter, if it's even possible. Here is a snippet from within my $.ajaxFileUpload() where I'm manually removing the UI components: success: function ( data, status ) { try { var index = /\d+$/.test ( input.name ) ? input.name.replace ( /^.+ (\d)+$/, '$1' ) : 0; /** * If there's an error in the upload process, remove the relevant * UI elements. */ if ( data['error'].length 0 ) { $('#multi_0_' + index ).remove(); $('a[href^=#multimulti_]:last').parent().remove(); /** TODO: have to decrement the counter within the MultiFile object...how? */ throw ( data['error'] ); } else { // Debug // alert ( data['files'] ); $('form').prepend ( 'input type=hidden ' + 'id=uploaded' + index + ' ' + 'name=uploaded' + index + ' ' + 'value=' + encodeURI ( data['files'] ) + ' ' + '/' ); } } catch ( e ) { alert ( 'Error: ' + e.message ); } }, Oh, to see the forest through the trees. It seems to work if I manually trigger the click event of the link. sigh $('a[href^=#multimulti_]:last').trigger ( 'click' );
[jQuery] Re: Interacting with the MultiFile Plugin
On Sep 17, 9:17 am, Rob Wilkerson [EMAIL PROTECTED] wrote: I have a form that is using both the ajaxFileUpload and the MultiFile plugins. When a user selects a file for upload, the change event uploads the file via ajax for validation. If an error occurs, I need to remove the file from the MultiFile queue. I can (and have) manually removed the elements, but that doesn't decrement the maxfile counter, of course. The easy way to do all of this is to trigger the MultiFile function that is called when the user deletes the file from the UI, but I can't figure out how to do that or, for that matter, if it's even possible. Here is a snippet from within my $.ajaxFileUpload() where I'm manually removing the UI components: success: function ( data, status ) { try { var index = /\d+$/.test ( input.name ) ? input.name.replace ( /^.+ (\d)+$/, '$1' ) : 0; /** * If there's an error in the upload process, remove the relevant * UI elements. */ if ( data['error'].length 0 ) { $('#multi_0_' + index ).remove(); $('a[href^=#multimulti_]:last').parent().remove(); /** TODO: have to decrement the counter within the MultiFile object...how? */ throw ( data['error'] ); } else { // Debug // alert ( data['files'] ); $('form').prepend ( 'input type=hidden ' + 'id=uploaded' + index + ' ' + 'name=uploaded' + index + ' ' + 'value=' + encodeURI ( data['files'] ) + ' ' + '/' ); } } catch ( e ) { alert ( 'Error: ' + e.message ); } }, Oh, to see the forest through the trees. It seems to work if I manually trigger the click event of the link. sigh $('a[href^=#multimulti_]:last').trigger ( 'click' );
[jQuery] SOT : CurvyCorners Plugin Issue in IE
I tried to post this question on the CurvyCorner forum, but it wouldn't let me activate my registration, so I thought I'd try here in the hopes that other users of the plugin can offer some insight. The plugin works great in Firefox and IE6 (my test browsers for now), but in IE, as soon as I add an opacity value to the container the rounded corners disappear and I'm left with just the original container. In Firefox, the opacity doesn't bother the plugin at all. What I have is an unordered list item (not a div) whose corners are to be rounded. The corners are rounded nicely and, at this point, looks exactly the same as in Firefox. I then apply filter: alpha(opacity=85) to the li (opacity=.85 in Firefox). Firefox handles the property fine, but IE just drops the elements that create the corners. Any idea why the application of an opacity property would have such a dramatic effect? Is there any way to avoid this (while maintaining the opacity specification)? Any thoughts would be greatly appreciated. Rob Wilkerson
[jQuery] AJaX Error
I don't think this is jQuery specific, but I'm using jQuery and this community is helpful as hell, so I thought I'd post to see whether anyone had any thoughts. I'm making an AJaX call to a PHP page that returns a lot of data in JSON format. 1. The PHP page is doing a lot of work and could take several minutes (or more) to return the data. 2. The Apache request timeout is unlimited. 3. When the error is returned, the exception object's message property reads: syntax error with no description. 4. When returning less data (i.e. 3 days rather than 7), the request is returned just fine. 5. Firebug indicates that the request never completes. The Response tab still says Loading... even after the call has errored and quit. The code: $.ajax ({ type: 'POST', url: '/reports/_report.php', dataType: 'json', data: filter, global: false, timeout: 90, // 15 minutes success: displayReport, error: function ( request, errtype, e ) { alert ( 'An error occurred while loading this report. ' + e.message + '(' + e.description + ')' ); $( '#out-' + report ).empty().append ( 'strongemError/em/strong' ); }, complete: function() { $(indicator).css ( 'visibility', 'hidden' ); $(src).css ( 'opacity', '1' ).bind ( 'click', runReport ); } }); If anyone has any thoughts on what might be happening, I'd really appreciate it. I Googled until my fingers bled, but couldn't find anything that seemed to make a difference. I'm hoping that maybe I've just been looking at it for too long and am missing the obvious. Thanks. Rob Wilkerson
[jQuery] Re: Help Modifying the Action Page of an AJaX Form
Okay, I found a way to do what I want to do, but ran into something else. Using the jQuery Form plugin, I've managed to serialize the form inputs and, via ajax, post the values to a page which returns a JSON result: $('[EMAIL PROTECTED]/run.png]').click ( function ( e ) { var data = $('#filter').formSerialize(); var report = this.id.replace ( /\w+-(\w+)/, '$1' ); data += 'report=' + report; $.ajax ({ type: 'POST', url: '/reports/' + report + '.php', dataType: 'json', data: data, success: displayReport }); } ); The problem is that formSerialize() doesn't properly encode checkbox values. Given a set of checkbox options with the same name, normal form encoding passes the values as a comma-delimited list. The serialized value just applies them separately to the query string so that the only one that is read is the last one. Instead of myselections=value1,value2, value3, I get myselections=value1myselections=value2myselections=value3. Has anyone else seen this? Am I missing something? Thanks. On 4/27/07, Rob Wilkerson [EMAIL PROTECTED] wrote: I have a form on a page that doesn't have a submit button, per se. Instead, there are a number of elements which, when clicked, should submit the form to an action page that is specific to the element that was clicked. I see that I can ajax-ify a form, but I don't see how to modify the action attribute at the time the form is submitted. Currently, I have this working fine, but I need to implement a form for user input while maintaining the dynamic action page and the ajax nature. $('[EMAIL PROTECTED]/run.png]').click ( function ( e ) { var report = this.id.replace ( /\w+-(\w+)/, '$1' ); $.getJSON ( '/reports/' + report + '.php', function ( result ) { displayResult ( report, result ); } ); } ); Any help? Thanks. /rob
[jQuery] Re: Help Modifying the Action Page of an AJaX Form
You can look at the spec here: http://www.w3.org/TR/html401/interact/forms.html Hmmm. I hadn't read the spec. I'm used to dealing with these things on the server side and never really had to think about how they were handled. PHP doesn't seem to be handling it the same way ColdFusion and, as Jeff pointed out, .NET does. All the $_POST value is reporting is the last value. I'll do some more digging on the server side and take another look at my code to make sure I don't have some other bug. Thanks for setting me straight.
[jQuery] Re: Help Modifying the Action Page of an AJaX Form
Apologies for my ignorance. I've been away from PHP for a long time and guess I forgot that I had to name my checkbox fields with array notation (e.g. input type=checkbox ... name=mycheckbox[] /). Once I did that and used implode() on the server side I got what I needed. Thanks. On 4/27/07, Rob Wilkerson [EMAIL PROTECTED] wrote: You can look at the spec here: http://www.w3.org/TR/html401/interact/forms.html Hmmm. I hadn't read the spec. I'm used to dealing with these things on the server side and never really had to think about how they were handled. PHP doesn't seem to be handling it the same way ColdFusion and, as Jeff pointed out, .NET does. All the $_POST value is reporting is the last value. I'll do some more digging on the server side and take another look at my code to make sure I don't have some other bug. Thanks for setting me straight.
[jQuery] Re: Using jQuery with Ext
Damn. You're absolutely right. I was trying to reproduce an old application that used iframes using the UI library provided by ext instead (without introducing any iframes). I was thinking about so many other possible issues that I missed the obvious one. Thanks for setting me straight. On 4/1/07, Brad Perkins [EMAIL PROTECTED] wrote: Rob, I believe the problem is that cross-domain requests aren't allowed. Were you able to do this prior to incorporating ext? What you probably need to do is make a request to your server, have it get http://www.myuri.com/index.htm by some means then return the content back to the browser. Brad On 4/1/07, Rob Wilkerson [EMAIL PROTECTED] wrote: I'm working with the latest Ext alpha and jQuery to create a paned UI and I want to load an external URI into one of those panels. I've got the layout nicely set up and I'm trying to get that URI to load via AJaX. There's not a lot of documentation I can find about that, so I'm winging it. I'm not having much success. The layout is loading on Ext.EventManager.onDocumentReady(). To load the panel, I'm trying: $(document).ready ( function() { $('#panel-bottom').load ( 'http://www.myuri.com/index.htm' ); } ); I've also tried a second Ext.EventManager.onDocumentReady() action. Also no luck. I'm sure I'm missing something, but I'm not sure where to look for documentation around blending jQuery with Ext. Can anyone tell me where I'm going wrong and/or point me towards any documentation? I appreciate it. Rob
[jQuery] Using jQuery with Ext
I'm working with the latest Ext alpha and jQuery to create a paned UI and I want to load an external URI into one of those panels. I've got the layout nicely set up and I'm trying to get that URI to load via AJaX. There's not a lot of documentation I can find about that, so I'm winging it. I'm not having much success. The layout is loading on Ext.EventManager.onDocumentReady(). To load the panel, I'm trying: $(document).ready ( function() { $('#panel-bottom').load ( 'http://www.myuri.com/index.htm' ); } ); I've also tried a second Ext.EventManager.onDocumentReady() action. Also no luck. I'm sure I'm missing something, but I'm not sure where to look for documentation around blending jQuery with Ext. Can anyone tell me where I'm going wrong and/or point me towards any documentation? I appreciate it. Rob