Trent Richardson
A new version of jQuery Impromptu is out. One is a change which I noticed a bug with webkit, textareas, and the show() effect. Form inputs are improperly positioned when the show() effect is used as the entrance effect. The default show effect is now fadeIn, as I believe it provides an equally pleasing effect. Another change is a new option for “top” so you can change the position from the top of the screen which the prompt is displayed. Another change was an undocumented fix to the closing escape key was also put into place.
On a closing note a couple users reported that Impromptu and jqModal do not play nicely together, however one user did mention they found the problem to be on the jqModal end. I’m not familiar with that plugin so I am unable to add any further input at this time. Enjoy everyone!
Related posts:
41 Responses
undoIT
21|Dec|2008Hi Trent. Thank you for this awesome script! It is very easy to integrate with Drupal. I have a question about the prompt overlay. Is it possible to set the entire overlay region surrounding the prompt as clickable for closing the prompt? Most of the lightbox scripts I have seen have this functionality and it is more convenient than having to position the mouse over the close button. Having both options to close would be great.
Cheers, Sean
trent
21|Dec|2008Hey Sean,
Thanks for using Impromptu. I don’t think that would fit the main goals of Impromptu as it is mainly to replace prompts and alerts, and force a user response. I already have a listener on the overlay but that blinks the prompt(well it toggles a style on a timed interval, its up to the CSS for it to actually “blink”).
I could always add it as an option, whether to allow clicking outside to close.. I will give this some thought. Thanks for the suggestion!
undoIT
23|Dec|2008If it is not too much trouble, it would be nice to have as an option.
china
25|Dec|2008GOOD!
trent
28|Dec|2008Hi undoIT,
I have added it as a new option called persistent. the default is true, which means clicking will not close the prompt, so there will be no changes for existing users. If you set it to false you will be able to click the fade and close the prompt.
undoIT
30|Dec|2008Works like a charm! Thanks Trent. Have a happy new year :)
SRays
13|Jan|2009Hi Trent,
I have already reported Select boxes[dropdowns] being hidden when the overlay was shown and then set the property useiframe to true to force the use of iframe and still the dropdowns are being hidden. This is happening only in IE6, after further analysis the select boxes[dropdowns] are visible till it executeâs the code jqif.fadeIn(o.overlayspeed); Once fadeIn executes the select box disappears, hope this helps you to give me an idea to overcome this.
I checked all the possible solutions mentioned in the other blog entries and no luck
Could you please take a look at this. It will be of great help
Thanks in advance.
undoIT
13|Jan|2009IE6 is a dinosaur. IMHO web developers should stop supporting that horrendous piece of junk browser. There is really no reason for people to continue using IE6 unless they are on a corporate computer that doesn’t allow them administrative privileges and their employee forces them to use it.
With a simple conditional comment, you can let IE6 user know that they need to upgrade their browser and all your IE6 hack headaches are solved. And, you are actually doing the visitor a favor. For an example of how this can be done, visit this post with IE6:
http://themebot.com/tips-and-tutorials/die-ie-down-with-internet-explorer
I got a little creative with it ;)
trent
14|Jan|2009Yeah, IE6 is a real pain to everyone, and I hope it is soon extinct. Unfortunately there are still too many people using it who don’t know of anything else. Maybe we should start using Impromptu with a prompt with only options to visit the FireFox, Opera, or Safari site when IE6 is used!
SRays
14|Jan|2009Unfortunately I am on a corporate netwrok and cannot getrid from IE6. Hence stuck and looking for a solution desparately.
trent
14|Jan|2009Sorry SRays, I completely overlooked your comment.. Can you please try a couple things for me and this would help me make changes to the plugin.
First thing to try is add an alert(‘test’);
after this line:
if(o.useiframe && ((jQuery.browser.msie && jQuery(‘object, applet’).length > 0) || ie6))
This should let me know if it’s getting in there when useiframe is specified.
Secondly try comment out:
if(ie6) jQuery(‘select’).css(‘visibility’,'hidden’);
If it still hides the selects then we know there is a problem with this statement:
if(o.useiframe && ((jQuery.browser.msie && jQuery(‘object, applet’).length > 0) || ie6))
Sorry for all this as I don’t have immediate access to ie6 all the time. Please let me know your findings! (Of course you should uncomment these things you’ve changed, as we will find the solution..)
SRays
15|Jan|2009Trent
Thanks for your response. I tried both the options you mentioned and the selects are still hiding. It is showing the alert when I add an alert inside if(o.useiframe && ((jQuery.browser.msie && jQuery(âobject, appletâ).length > 0) || ie6)). Also, I tried commenting if(ie6) jQuery(âselectâ).css(âvisibilityâ,’hiddenâ);
Thanks you very much for your co-operation and patience, any break through is really really appreciated..
Thanks
trent
16|Jan|2009With
jQuery(âselectâ).css(âvisibilityâ,âhiddenâ);
commented out it definitely shouldn’t have hidden the selects no matter what. Unless its the iframe doing it. Can you comment out all those lines. If you can try one more thing and in the mean time i’ll try to track down ie6 and test myself.
Can you comment out that entire if/else statement and only leave the following line:
msgbox +=’<div class=”‘+ o.prefix +’fade” id=”‘+ o.prefix +’fade”></div>’;
bootZ
16|Jan|2009Very nice tool!! But also wanted the ability to show images on the button, so here are the changes I have done to allow for this (I have remove html tag brackets as they get stripped when posting):
jQuery.each(o.buttons,function(k,v){ var itm={};itm=(v+â:’+k).split(â:’);msgbox += â button name=ââ+ o.prefix +âbuttonâ+ k +ââ id=ââ+ o.prefix +âbuttonâ+ k +ââ value=ââ+ itm[0] +ââ â+ itm[1] +â button â});
⊠and
//Events
jQuery(â#’+ o.prefix +âbuttonsâ).children(âbuttonâ).click(function(){
var msg = jqi.children(â.’+ o.prefix +âcontainerâ).children(â.’+ o.prefix +âmessageâ);
var clicked = ((o.buttons[this.name.substr((o.prefix+'button').length)]+â:’).split(â:’))[0];
if(o.submit(clicked,msg))
removePrompt(true,clicked,msg);
});
So you pass the contents in the same field as the value separated by the â:â – of course goes without saying that you may need to substitute â:â to another character to be parsed on if using the â:â within your image/html code. Here is my example:
buttons:{Confirm:âtrue: img src=”images/image1.png” alt=”Confirm Update” Yesâ,
Cancel:âfalse: img src=”images/image2.png” alt=”Cancel Update” Noâ},
so I get the images with ‘Yes’ and ‘No’ next to each one, but doesn’t stop there as your passing formatting to the utility. I get the correct result back in the callback as using the button name and stripping the prefix + ‘button’ references.
Hope this helps anyone.
SRays
16|Jan|2009When I comment the entire if/else and only leave msgbox +=ââ;
selects are not hiding but they are over the overlay div and are accessible.
SRays
16|Jan|2009sorry I meant leave msgbox +=ââ;
SRays
16|Jan|2009The code is not appearing properly here..I did leave the line you mentioned
trent
16|Jan|2009Ok, try changing this line:
if(o.useiframe && ((jQuery.browser.msie && jQuery(‘object, applet’).length > 0) || ie6))
to just:
if(o.useiframe && ie6)
trent
16|Jan|2009Thanks Bootz for posting!
SRays
16|Jan|2009I tried changing if(o.useiframe && ((jQuery.browser.msie && jQuery(âobject, appletâ).length > 0) || ie6))
to just:
if(o.useiframe && ie6)
but no luck :(
undoIT
16|Jan|2009btw, if you are running Linux and want to test your websites in IE6, this is a very handy tool:
http://www.tatanka.com.br/ies4linux/page/Main_Page
I use it to make sure my conditional IE6 upgrade notifications are working ;)
trent
19|Jan|2009Excellent, I have installed this before and it does work well! I need to reinstall I guess..
Brad
22|Jan|2009I don’t know if anyone has had this problem, but in IE7 & IE8, I am getting a “jqi.css(…) is null or not an object” error. I originally was using 1.5, but have since upgraded to 1.8 to no avail. This is occurring on line 91 in the positioning function.
The prompt is appearing, but is not being positioned, and it won’t accept input of any kind.
It is working awesomely in FF, though.
trent
22|Jan|2009Hey Brad,
IE will throw this error if you have errors in the html you pass into the prompt.
Brad
22|Jan|2009This is the text I am sending it. I don’t see any readily obvious HTML issues, but I will keep looking to see if I can clear this up.
Add Daily TimeAMPM
Ben K
23|Jan|2009Thanks Trent for your great plugin!
i started using it as an ajax form input, but then it just took over as my default notification system!
I am also interested in the idea you floated about having the box change states (as i use it for a session timeout warning, that then changes to a “you have been logged out” message.
Also is there a way for multiple dialogues to play together?
cheers,
keep up the good work,
Ben
trent
23|Jan|2009Hey Ben,
Glad you’re getting good use out of it. The different “states” I envisioned would have sort of a coda slider concept, where you might step(or slide considering the coda slider) into new forms within the same prompt. It would allow you to pass in an array of parameters, each being a new “state”.
Unfortunately I haven’t had the time to implement such, nor have I thought of how to do this without losing backwards compatibility. Hopefully I will have a moment of inspiration soon and implement it as I’ve needed this myself!
L.
23|Jan|2009I’ve been trying to use impromptu inside an unload function and it simply refuses to work.
I am trying to replace a call on confirm that asks if the user wants to save data. Even I just call something like $.prompt(‘cxccc’), nothing at all happens – it’s as if the call was completely invisible. It is working fine elsewhere on the page. Only in the unload function is there a problem.
Any ideas or suggestions?
Tim
23|Jan|2009Is there away to call the function removePrompt() from outside of the script?
I tried to create a function called
closePrompt() { parent.removePrompt(); }
Which is called from inside a iframe on the page – getting scripting errors. Most like – hmm I don’t get JavaScript as much as I like to.
Any suggestions?
trent
23|Jan|2009L,
I’m not too sure, thats something I’ve never tried. I’ll try to work up an example and see..
Tim, do you have a cancel button on your prompt?? just call the cancel button..
$(‘#jqibuttonCancel’).click()
trent
23|Jan|2009but the short answer is no there is no method, you can also do:
$(‘#jqibox’).fadeOut(‘slow’,function(){ $(this).remove(); })
Tim
24|Jan|2009That you oh so very much as the solution in comment 31 worked like a charm!
L.
25|Jan|2009I meant to add that I tested an identical call on prompt outside the unload function and it works like a charm so it is not (I guess) an error in the way I am calling it.
trent
25|Jan|2009L,
I found the issue with onbeforeunload. You will need to return false:
window.onbeforeunload = function(){
$.prompt(‘test’);
return false;
}
Even then the browser will pause, and ask if you want to navigate from the page. If you choose cancel you will see the prompt, otherwise you navigate away from the page.
By navigating away from the page onbeforeunload still runs, but Impromptu lacks the ability to pause processing like an alert or comfirm. Hope that helps!
L.
29|Jan|2009Ugh, that’s nasty – essentially you can’t do what I want to do then (and it seems that many, many other people have had this problem with other modal popups). Thanks.
Ben K
04|Feb|2009is it possible to have multiple prompts?
for instance if you have a form in a prompt, and you go to submit,
you could have another prompt that confirms the submission?
trent
05|Feb|2009Yes, it is possible as long as it’s within the callback function. The prompt will actually close and reopen however. I’m currently thinking on how to reengineer Impromptu to allow multiple “states” that you can transition to without closing the prompt. I don’t have a timeline for completion of this yet unfortunatly..
trent
12|Feb|2009Ben K,
The new version now supports states as I mentioned in the above comment.
sethurajan
22|Jan|2010Hi Trent, Even I face the issue of vanishing drop downs whenever prompt appears. I think what you tried to address is to avoid select boxes appearing over the DIVs in IE6 since IE6 treats select boxes as windows. But you should hide only the drop down that overlays with the DIV and not all drop downs in the page. Do you have any suggestion / solution for this?
jignesh
20|Jul|2010i need to knw..whether this thing works on a ModalPopupExtender with an iframe….loaded inside it…
i knw the problem is with the z-index….
the prompt gets loaded first and then goes behind the modal popup???? ny suggestions
jignesh
20|Jul|2010it does work in mozilla but not in IE 8 ……