jquery message windows / dialogs - javascript

I have some ajax calls in one of my pages. On complete I want do display a simple message letting the user know that the operation has been completed. maybe with an ok button that they can click to close the window. Alert("message") would work if I could remove the title and that scary "!" icon.
Any jquery/javascript sugestions? -Thanks

Check out the jquery ui Dialog plugin:
http://jqueryui.com/demos/dialog/
You can customize it to suit your needs, and add what ever kind of buttons you want. It's just HTML inside the dialog.

Could use a modal dialog. Check out the modal dialog in jQuery UI http://jqueryui.com/demos/dialog/
Basically when the AJAX request is completed and successful you can open your dialog with an ok button and display whatever title you would like.

I like simplemodal. It also has a confirm style dialog - this looks similar to the default alert/confirm dialogs. You can see a demo here.

Related

How to make the Background behind Alert Box clickable?

I have a application where i make all Divs clickable by using this code :
$("html").click(function(){
alert("Click");
return false;
});
This one work normally for all divs. Well, when Alert popup, the Background behind alert box cannot be clicked. How can i turn that to be clickable too?
PS: Right Click on the Background dont work too.
Thats not possible. You have to use a JS plugin doing the alert, so you can influence the behaviour (like the jquery ui modal widget, mentioned here). But with the browser alert this is not possible, as far as i know.
Not sure how to do exactly what you're asking (if it's possible). Maybe someone else can shed some light on that.
But a solution you could look into would be the dialog widget from jQuery UI. You can easily create pop-ups, modal or non-modal (meaning with the background faded out or not).
http://jqueryui.com/dialog/
They have some demos there, but it's as simple as created a div with some text and calling...
$("#the_div_id").dialog();
Other config parameters can be found from the API:
http://api.jqueryui.com/dialog/
By default its modal popup behaviour ,If you want to clickable
Assuming you are using Jquery Ui dialog
Try with the option modal
$('#selector').dialog("option","modal",false);
http://api.jqueryui.com/dialog/#option-modal

How to custmize & Design the `alert()` box?

Here is script in my website's footer that will check that specific font installed or not in computer. If installed or not it will prompt alert box. I want to customize:
Design of that alert box
Replace the 'OK' button with 'Download' button that also have download link.
Write some RTL words in new paragraph. For Example Urdu words like آپ کے کمپیوٹر میں۔۔۔۔
Just accept that it's not going to be an alert() box, but rather it's just going to be normal HTML+CSS. So you will just position the box wherever you want it with whatever buttons you want and whatever way you want it to look. Or if so you'd whish their are plugins which already do this for you (though they limit your options quite a bit of course). You might want to look at jQuery UI if you're using jquery for example (specifically the dialog component of jQuery UI).
you have to use jquery dialog box for this type of customization. Use this link
I use Sweetalert for designing the Alert box. its easy, simple and efficient.
here is the link to download SweetAlert and example codes worked out at Here

Show custom message and button text for javascript confirm dialog?

Is it possible to give custom message for buttons instead of Cancel/Ok and give my own text?
I saw lots of tutorials on replacing js confirm with jquery dialog. But isn't there a way with using native JS? I see the same thing done in Grooveshark and many other pages; when user wants to navigate away from their page user is prompted with a js dialog box with custom buttons like 'Stay on page/Leave page'?
Any idea how they might be implementing this? Their dialog box appears as if generated using native JS!
I believe you were seeing a slightly different dialog box.
Add this to your page:
window.onbeforeunload = function() {
return "Are you sure you want to navigate away?";
}

How to make a jquery popup menu

I am trying to make a Login popup window. For example, if someone clicked the login button a popup window will show and it will change the opacity of the main page and give focus to the popup window.
Here is an example of a web site that utilizes what I want to implement.
You can use the jquery dialog referenced in your post for this.
Here is an example of how to create form elements on it.
you could use jqueryUI dialog
you could also use the jQuery BlockUI plugin:
http://plugins.jquery.com/project/blockUI
I've used the Boxy plugin before, it's very lightweight (lighter than JQueryUI, although not as much functionality).
It's very easy to use, it was the first plugin I used when learning jQuery.
http://jqueryui.com/dialog/#modal-form
use this site link
Use a modal dialog to require that the user enter data during a multi-step process. Embed form markup in the content area, set the modal option to true, and specify primary and secondary user actions with the buttons option.

Pop up box in Ruby on Rails

I want to display a popup windo on my rails application... Here is exactly what i want is . I have the line called "My profile" (for link i used link_to). if user clicks the link the popup should come out and displays the user's profile details.... i tried with :popup => 'true' option but it creates new window. i want some Ajax kind of stuff... can any one help me on this.
This is not a ruby-on-rails question. What you need is some javascript library to do that. As mentioned by Salil, lightbox is one such library. Others include:
colorbox
jQuery UI dialog
Fancybox
shadowbox
I personally tried lightbox, thickbox (no longer supported), colorbox, and shadowbox, and found colorbox to best fit my needs.
use lightbox to achive it.Rails provide lightbox_helper plugin.
Here is the path I would follow: First, you "load" data from your application with the JQuery load function. For this you can use a normal controller action with a some basic view. Then, you want to put it in a fancy Jquery popup, e.g. explained here

Categories

Resources