Open Source Resources for Web Application Developers

Shopify - Online Store Builder
Follow Us on Social Sites
Subscribe RSS Subscribe Newsletter Like us on Facebook Follow us on Twitter Follow us on Google+
  • Home
  • News
  • Plugins
  • Design
  • Others
  • Books
  • About
03 Feb

How to Create jQuery Custom Confirm Dialog Replacement

  • License Free, Popup
  • Leave a Comment

Tutorialzine are teaching us how to build a cross-browser, jQuery Custom Confirm Dialog Replacement. You can choose the text, buttons, and actions that will be executed when they are clicked.

You can customize the appearance of the dialog by modifying jquery.confirm.css. As the message attribute of the dialog takes HTML text, you can further customize it by displaying images and icons in the confirm window. You can even alternatively use this plugin as an alert dialog – you will just need to pass a single button with no action attribute.

confirm-dialog

Requirements: jQuery Framework
Demo: http://demo.tutorialzine.com/2010/12/better-confirm-box…
License: License Free

Share
Tweet
Sponsors
subscribe to our newsletter - weekly free resouces for web developers
follow us on social sites - rss, facebook, google+, Twitter
Subscribe RSS Like us on Facebook Follow us on Twitter Follow us on Google+
Related Resources
jQuery Alert(), Confirm() and Prompt() Dialogs Replacements

jQuery Alert(), Confirm() and Prompt() Dialogs Replacements

Elegant and Simple Modal Windows for Mootools

Elegant and Simple Modal Windows for Mootools

More Informative & User Friendly Download Experience

More Informative & User Friendly Download Experience

Create Alert, Confirmation Messages with Noty jQuery Plugin

Create Alert, Confirmation Messages with Noty jQuery Plugin

Hide Spoilers on Site with Spoiler Alert jQuery Plugin

Hide Spoilers on Site with Spoiler Alert jQuery Plugin

Apprise: Attractive Alert and Dialog Box for jQuery

Apprise: Attractive Alert and Dialog Box for jQuery

Comments
  • http://www.themodernprogrammer.com The Modern Programmer

    I can’t really see what this offers that the JQuery UI’s built in dialog doesn’t…

  • http://www.vrusso.com.br/ Vicente Russo Neto

    If you are looking for an unobstrusive solution for native confirm function, you may take a look at this solution posted on my blog http://bit.ly/hFvCXt

  • bab

    Hi, it is a nice and neat plug-in but I have some problem.
    Here is how I use it in my page :

    $(document).ready(function () {
    $(’.ResponseLink’).live(’click’,function () {
    var idval = this.id;
    $.ajax({
    url: “/Admin/Contact/Edit”,
    data: { id: idval },
    dataType: ‘html’,
    success: function (mydata) {
    $(”#ContactArea”).empty().append(mydata);
    },
    type: “GET”
    });
    return false;
    });

    $(’.RemoveLink’).live(’click’, function (e) {
    e.preventDefault();

    //var elem = $(this).closest(’.item’);

    $.confirm({
    ‘title’: ‘Delete Confirmation’,
    ‘message’: ‘You are about to delete this item. It cannot be restored at a later time! Continue?’,
    ‘buttons’: {
    ‘Yes’: {
    ‘class’: ‘blue’,
    ‘action’: function () {
    //elem.slideUp();
    }
    },
    ‘No’: {
    ‘class’: ‘gray’,
    ‘action’: function () { } // Nothing to do in this case. You can as well omit the action property.
    }
    }
    });
    });
    });

    When page loads and I click on RemoveLink it shows confirmation dialog, but after clicking on ResponseLink, if I click on RemoveLink again, the fire-bug console shows this error : $.confirm is not a function

    Would you help me please ?

Open Source Resources for You

What we need is a list of the top quality resources, so that we can spend more time on our web development. WebAppers only picks the top quality web development resources for you.

© Copyright 2012 WebAppers | About | Archives | Privacy Policy | Advertise | Contact

Sponsors
Advertise Here
Search
By Keywords
30 Days / All Time
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • Professional Business Cards Made By Designers
  • Best Free Chrome Extensions for Web Developers
  • All of the Best Free WordPress Themes You Need
  • How to Create a Web App Admin User Interface
  • Nice List of Open Source Fish Eye Menu
  • Best Web Admin Templates
  • 25 Useful Blogs for Web Design & Development
  • Simple Javascript Progress Bar with CSS
  • 10 Useful & Quality Design Resources
  • Free Web Application Icons
  • Free Responsive HTML5 + CSS3 Site Templates
  • 35 Creative Twitter Covers for Web Designers
  • FROONT: Responsive Web Design in the Visual Way
  • Designing Experiences for Responsive Web Sites
  • jQuery Unveil: The Lightweight Version of Lazy Load
  • What are HTML5 Datalists and When to Use Them
  • Easy Responsive Tabs jQuery Plugin for Web & Mobile
  • jQuery.Swatches Turns Div into a Sweet Color Swatch
  • Pure: A Set of Small & Responsive CSS Modules
  • Create Sexy Android-like UI with Fries
Sponsors
Plugins
  • Advertisement15
  • Calendar48
  • Capture19
  • Charts55
  • Chat22
  • Demo Tour17
  • Gallery121
  • Maps30
  • Menu87
  • Polls9
  • Popup50
  • Tooltips42
  • Upload33
  • Video18
Desgin
  • Brushes11
  • Buttons27
  • Color Schemes25
  • Fonts47
  • Forms115
  • Icons110
  • Patterns24
  • PS Tutorials17
  • Stock Photos21
  • Tables25
Others
  • Announcement104
  • Best Collections6
  • Code57
  • eCommerce25
  • Framework217
  • Hosting13
  • Information244
  • Inspiration32
  • Legal Documents10
  • Reviews8
  • Security13
  • Social28
  • Sound16
  • Stats39
  • Tools302
  • Webmail14
Licesnes
  • BSD License69
  • CC License123
  • GPL License224
  • LGPL License40
  • License Free749
  • MIT License422
Sponsors
Advertise Here
Partners
MaxCDN