Mon 31 Mar 2008
Thanks for the escape key contributions as well as catching and reporting other bugs. To the best of my knowledge I have those fixed and updated the documentation(the rounded corner example as well). Although these weren’t crucial fixes still may want to grab the latest.
April 1st, 2008 at 1:32 am
Thanks! Works great.
April 8th, 2008 at 8:52 am
I’m having positioning problems with your script and was wondering if you could help.
It pops up centered horizontally but not vertically. In 1.4 it pops up with top: 0; and in 1.5 it pops up within the screen, but not centered, it’s like on the top 1/2 of the screen. Is it possible to modify/adjust this via css?
Thank you
April 8th, 2008 at 10:09 am
The positioning is done mostly via javascript, and then use CSS for everything else. Is this problem only in one browser or all? Some changes did occur to the css in the last couple versions. Might want to be sure you have the latest.
April 8th, 2008 at 1:35 pm
Thanks trent,
I tried the CSS, and that wasn’t the case… I looked at your js, on line 89, you have a top: 100px, i changed it to 40% and it works like what I wanted
April 8th, 2008 at 1:55 pm
Excellent, sorry I couldn’t be of more help, but glad you got it to work correctly!
April 8th, 2008 at 2:37 pm
All of the examples work with form buttons. I would find this helpful to be able to place this on a link as well. We use a link with a graphics icon instead of form buttons for looks. It would be nice to have a “delete” icon but still have a confirm box work.
Do you have an example of how that might work?
April 8th, 2008 at 4:01 pm
Hey John,
Impromptu does not do that, however it should be very easy to swap buttons for links.. with the plugin just change the html to links(its near the top of prompt function). Then also make sure anywhere that references jQuery(’button’) or similar is changed accordingly. I’ve not done this though so I’m not sure what else you may run into..
April 10th, 2008 at 1:29 pm
Thank you for your response. I have moved to buttons, but I have a bit of a different problem now.
When calling a function, is it possible to have more then one parameter passed to the function? If so how?
‘
onclick=”$.prompt(’Confirm form deletion.’, {
callback: deleteSqf,
buttons: { Delete:”:”, Cancel:’cancel’:'noUrl’ }})”
>
Note how I tried to put a second parameter in each with a ‘:’, but I am not sure is this is valid or what the real syntax should be.
April 10th, 2008 at 1:30 pm
Well…some of that last post got cut off, but you can kinda see from the “Cancel” button idea.
April 10th, 2008 at 2:43 pm
Hey JohnE,
Unfortunately that won’t work. the { Cancel:’cancel’ } is an associative array, there is only a key and a value {key:value} If you need other values you will have to embed them within your html you pass to the prompt in hidden input fields or use some sort of scheme for your button values…
{ Ok: “val1_val2_val3″, Cancel: “val4_val_5″ }
but then you will have to come up with some way to parse that string.. Hope that helps!
April 10th, 2008 at 5:37 pm
Yeah!!! I did what you mentioned and it works fine. I combined, then split the parameters.
On Firefox 2.* the prompt looks great.
Our company has to have many people stuck on IE 6.0 browser, however. In that browser, the pop-up sometimes appears high on the screen and is half covered by another element on a Liferay page we have here. If I scroll down, I can get the pop-up to appear.
It might work if I could position pop-up, but I don’t think that is an option to do so.
In Liferay it looks like it get stuck half under Liferay’s header part.
Thanks for all the help by the way.
April 11th, 2008 at 7:52 am
To try to solve the IE6 issue in Liferay, I have been messing with the z-index property in both the CSS and JavaScript properties. For some reason, even if I set the value to very high, it still shows up half under the Liferay banner and high on the screen. The notes surrounding z-index says that it only works with positioned items, but I’m not sure exactly what is going on. There are no JavaScript errors at this stage.
http://www.w3schools.com/htmldom/prop_style_zindex.asp
April 11th, 2008 at 8:16 am
Apparently this is a common problem. I have not solved it yet here, but these links are telling:
http://www.last-child.com/conflicting-z-index-in-ie6/
http://aplus.co.yu/lab/z-pos/index7.php
April 11th, 2008 at 8:43 am
Is it being hidden under a flash element?
April 11th, 2008 at 10:14 am
No flash on the page. It is just the Liferay portal header it hang partially under, and only in IE6.
It does appear high on the screen in IE6, IE7, and Firefox.
It may be something with its interaction with the Liferay header, but I had not seen that happen before with other items.
I am still trying to figure it out here, but I am much better with Java then JavaScript/CSS oddities.
April 11th, 2008 at 1:08 pm
ie6 is a major pain,so many bugs there’s no telling.. have you tried the useiframe option?
$.prompt(’hello world’,{ useiframe: true });
This option was added for ie6 mainly, so if thats your companies main browser you may want to set that. To set the default to true so you don’t have to declare it every time:
$.SetImpromptuDefaults({ useiframe: true });
Hopefully that will help
April 14th, 2008 at 10:43 am
Sorry for hogging up this blog, but not sure where else to post. Thank you so much for helping though.
The fix you mentioned didn’t place the pop-up on top above the Liferay header. I had tried BlockUI, before using this one. I had to hack it a bit to get it to work with my code and the resulting output was very harsh for what I needed to do (dynamically creating the fields). It did, however, not have the high position or behind the frame issues. Maybe there is something different they are doing. I would much prefer to use this widget because its API integrates much better.
The code I am using currently looks like:
$.SetImpromptuDefaults({ useiframe: true, show: ‘fadeIn’ });
onclick=”$.prompt(’Are you sure you want to delete the saved form?’, {
callback: deleteSqf,
prefix: ‘colsJqi’,
focus: 1,
buttons: { Delete:’delete’, Cancel:’cancel’ } })”
April 14th, 2008 at 7:57 pm
Hey JohnE,
Thats quite alright, its what this blog is here for. Sounds like you may have some broken html somewhere. Have you tried validating your page just to see if there are any broken tags??
http://validator.w3.org/
Also you may want to take your exact impromptu css and create a very simple page just to see that everything lines up correctly. That may atleast indicate whether its within impromptu or you page.
April 14th, 2008 at 7:59 pm
Also may want to validate your css just to check for missing semicolons or brackets:
http://jigsaw.w3.org/css-validator/
April 15th, 2008 at 5:48 am
Thanks
This is great script!
April 15th, 2008 at 9:43 am
I am using your examples.css without changes. It validated correctly using the link you gave me. I understand this is an edge case maybe.
April 18th, 2008 at 9:42 pm
example 13 does not always show the close “X” which seems to oddly float above the dialog box. (firefox2, win-xp)
also rounded corners do not show in example 12 and do not work if added to example 13 either…..
onclick=”$.prompt(brown_theme_text,{buttons:{Ok:true,Cancel:false}, prefix:’brownJqi’}).corner();”
seems to need a way to display a form for like login so it can capture values and send them back to the page..
April 19th, 2008 at 5:20 pm
Hey JP,
Example 13 is just in the design that was submitted. The rounded corners should now be fixed as I forgot to update that example. As with the form it captures the entire prompt when a button is clicked, and passes that jQuery object to the callback functions. Any form fields you need can be accessed from that object passed using the jQuery .children() or .find() functions.. example 9 and 10 are examples of this.
April 24th, 2008 at 6:27 am
Thanks for a great package! I am really looking forward to get rid of my old confirm boxes.
I have on problems which also is a security issue. Either I am doing something wrong or this is a bug. I am passing encoded HTML to msg but in the popup this appears as HTML, not text, making it wide open for XSS. The code I’m using:
function confirmBox(text,confirmLocation){
$.prompt(text,{ buttons: { Ja: true, Nei: false }, focus: 1,callback: function(v,m){if(v)window.location=confirmLocation} })
}
April 24th, 2008 at 6:30 am
That example didn’t work well in your blog either. Here is a link:
http://test.akkreditering.net/example.txt
April 24th, 2008 at 7:30 am
Hey Ketil,
Unfortunately it does have to be html, not encoded. Not sure if you’re forced to set the text within the onclick attribute, but you could always assign the click event with javascript if you’re having trouble with quotes:
$(’#el’).click(function(){});
April 25th, 2008 at 8:32 am
I really like Impromptu and was trying to get it to work in a web site I am developing. I have spent the past two days struggling with a problem in IE6. The following two URLs work in Firefox, but the NEW001 works in IE6 and the NEW003 doesn’t. I’ve had to put a try..catch around the “jqi.css” code in jquery.impromptu.js to get even this far in the NEW003 example. Any help would be appreciated.
207.139.200.49/ormsys/new001.html
207.139.200.49/ormsys/new003.html
April 25th, 2008 at 9:18 am
IE has issues with Doctypes. I havn’t had many users report issues lately, but some previous versions of Impromptu would act like this without a Doctype. Impromptu works best with an xhtml strict. That may not be what you want to hear at this point becuase it looks like you’re pretty far along, but I would try plugging it in and see if it breaks anything. Hope that helps!
April 25th, 2008 at 10:56 am
Great Work!! Thanks
April 30th, 2008 at 2:09 am
Thanks for a great package! I am really looking forward to get rid of my old confirm boxes.
May 5th, 2008 at 11:15 am
I really enjoy Impromptu; it serves as an excellent and flexible replacement for the alert boxes.
3 issues:
1) Under IE6/7, I can’t seem to set the focus to a particular button. If I pass a function that sets the focus, as the loaded option, the focus is set.
2) Using the Tab key, I can tab to controls behind the DIV overlay.
3) If a prompt is opened after another prompt has been opened and not dismissed, the resulting prompt doesn’t respond.
Thanks again for an excellent plugin.
May 9th, 2008 at 12:07 pm
I have found that with version 1.5 in Safari/Windows, I was seeing really weird behavior in a textbox — kind of like Example 10 but more complex — where the text floated above the box.
Anyway, comment out the final focus in the js or set the focus to some high number like 27, and the problem goes away. Took me a long time to track down, so I hope this comment helps somebody else.
May 9th, 2008 at 1:56 pm
Hey Kevin,
Ironically enough I just tried my contact form for this site and does the same thing! I never noticed it. Thanks for the tip! I will look in to why its happening as well, sounds like a safari bug to me tho.
May 16th, 2008 at 3:08 am
dude this script looks awesome.. so much simpler than ANYTHING else out there. “perfection is reached not when there is nothing left to add, but when there is nothing left to take away”.. oh btw, how about adding this thing to github.com?
May 16th, 2008 at 3:20 am
maybe jqmodal is a bit better though
May 16th, 2008 at 7:00 am
kyrre, thanks for the complement. No way jqmodal is better!
I think you have to accept Impromptu for what it is. For an multipurpose modal jqmodal may have an advantage. You can of course create alerts and prompts with jqmodal, but that is what Impromptu is designed for as it handles all of your buttons and creating sort of a validation method for you.
May 26th, 2008 at 4:09 am
Hello,
Is it possible to close the prompt in programming (without click buttons) ?
Thanks.
May 26th, 2008 at 3:05 pm
Closing the prompt should be very easy with jQuery. It might work like the following:
var p = $.prompt(’hello world’);
//remove it quickly
p.remove();
//remove it prettily with hide
p.hide(’slow’,function(){ $(this).remove(); });
May 27th, 2008 at 3:53 am
Merci beaucoup Trent ! ça fonctionne…
Je suis encore débutant avec jQuery.
Bonne continuation
(sorry for french)
May 27th, 2008 at 10:35 am
Merci, j’espère que vous apprécierez
(Hope thats right, I don’t know french.. Im hoping google translate does
May 29th, 2008 at 11:22 am
Hi Trent,
Nice plugin. however I ran into some memory problems using it. I’m using IE6 If you repeatably call the plugin the memory keeps building up and building up (approx 6mb each time). You have to refresh the page before it is relinquished. This maybe caused by the underlying jQuery. I have experiences similiar problems with jQuery when using its append() and html() methods
Rob.
June 3rd, 2008 at 10:44 am
I def use append(), I will have to do some research on that. Sounds like a jQuery/ie6 bug. I sure will be glad when ie6 fades out, its a real pain!
June 6th, 2008 at 12:06 pm
Just wanted to say that I think this is a great plugin. Nice and lightweight, and does wht it’s supposed to do very well. It’s also nicely written and easy to modify/extend. My hats off to you!
June 12th, 2008 at 12:20 pm
Hello Trent,
let me thank you first for your plugin.
I wonder if you could suggest me how to make following behaviour with your plugin:
I want to be able to display html form in inpromptu, then after submitting, send it by mean of ajax to server and then display response in inpromptu. I managed to do it. The only problem is following:
When somebody is presented with a form there should be 2 buttons: ‘Submit’ and ‘Cancel’. However when the form is submitted and user get confirmation then I would like the two original buttons to be removed and in exchange to display ‘Close’ button.
Can you suggest how this can be achieved in inpromptu?
Here is what i have done so far: http://nieruchomoscibulgaria.pl/index3.php
thank you very much again
June 12th, 2008 at 12:53 pm
Hey Oskar,
Thank you for using Impromptu! I have to say it has made my life a lot easier.
What you are trying to do is very similar to this example (except you are sending an email where I was updating the database)
http://trentrichardson.com/Impromptu/demos/demo2.html
Instead of trying to remove buttons and add them back I would allow the first prompt to close, then pop open another Impromtu box saying successfully sent or error has occured. There are event handlers and such involved with add and removing buttons and I have not found a clean solution for this yet.
Sorry if this isn’t the exact solution you’re looking for, but doing such would take a good example to show you, I don’t have one on had.
June 13th, 2008 at 11:22 am
Hey Trent,
thanx for the suggestion, however i decided to push my idea and managed to insert working ‘Close’ button :).
On the site that i am builiding in drupal i am using very extensively two jquery plugins:
it is impromptu and tabs by Klaus Hartl.
I experience one strange behaviour (in Opera only) that impromptu is not displayed above tabs.
Basically the default tab is displaying through impromptu and even through impromptu fullpage background (I do not know how to describe it better, English is my limitation).
Do you know what is the reason and how that can be corrected?
I am displaying forms in impromptu and hanging tab is giving really bad feeling :).
Here is example: http://nieruchomoscibulgaria.pl/offers/list .
You can click on ’save search’ link in left column to see the effect (again Opera only, at least in 9.21 on Windows)
thank you again
Oskar
June 13th, 2008 at 4:47 pm
You’ve probably created the best looking Impromptu I’ve seen so far! nice work. This is a strange problem.. you might want to try getting zIndex of that tab button and then assigning increasing the zIndex by one for Impromptu. zIndex is a strange animal and doesn’t work very often, but it appears to be the problem, whether that fixes it or not..
June 18th, 2008 at 10:05 am
yes,the first thing i have done was to set zIndex.The active tab has zIndex of 2, set programatically. It is a pitty that probably there is no tool like Firebug for Opera that I could try on fly to set different properties and see which one works. Anyway thank you for suggestion. I will try somehow to overcome this behaviour, probably by setting some simple test page. thanx for the plugin again
June 18th, 2008 at 10:24 am
The new version of Opera now has developer tools, which in my opinion are atleast as good as firebug:
http://trentrichardson.com/2008/06/12/opera-95-is-here-woohoo/