jQuery Alert Box

Is there a good way to set an alert with jQuery?

i have a PDF that i need my visitors to agree to before the proceed...

So: User Clicks PDF link Alert Box opens: "you must agree to our statement before we give you this PDF" I Agree button (PDF download proc开发者_Python百科eeds) / I Disagree Button (box closes and original page is displayed)

Is that the best method to handle this?

Should i use a dialog box?

---

I would suggest using a modal confirmation dialog. It also blends out the background, making the dialog more prominent.

The documentation is under http://jqueryui.com/demos/dialog/#modal-confirmation

---

I have found after MUCH messing the best way is this as an easy way of emulating the javascript native alert using the dialog ui, is done as follows (which incidentally I wrote myself, because there is a high scarcity of usable stuff on this subject and lots of people whittering on about using plug ins, make a multi stage 'this' or irritating 'that' ZZZzzz...):

NB: You can't really do a equivalent of the confirm() function - without fass but you can use html rich alerts and add the events for that rich html yourself at the end of the jQueryAlery() call.

it works fine and includes a optional debug for 'viewing' the html or the 'url' in the case of the latter

function JQueryAlert(message,windowHeight){
    /****
     *  equivalent to javascript 'alert'
     */
    if (!windowHeight) var windowHeight = 470;

    $("#msgdialog").remove();

    $("body").append("<div id='msgdialog'></div>"); 

    thatmsg = $("#msgdialog");

    $("#msgdialog").dialog({
        resizable: false,
        draggable: false,
        width: 770,
        height: windowHeight,
        context: thatmsg,
        modal: true,
        autoOpen: false,
        buttons: {
            "Cancel" : function (){
                thatmsg.dialog("close");
            }/*,
            "View Source" : function (){
                alert($('<div>').append($(this).clone()).html());
            }*/
        }
    });     

    $("#msgdialog").html(message);
    $("#msgdialog").dialog('open');     
}

same as above except it goes and gets the content from a url

  function JQueryHTML(url,windowHeight){
    /****
     *  equivalent to javascript 'alert' but gets a url
     */

    if (!windowHeight) var windowHeight = 470;

    $("#dialog").remove();

    $("body").append("<div id='dialog'></div>"); 

    that = $("#dialog");

    $("#dialog").dialog({
        resizable: false,
        draggable: false,
        width: 770,
        height: windowHeight,
        context: that,
        modal: true,
        autoOpen: false,
        buttons: {
            "Cancel" : function (){
                that.dialog("close");
            }/*,
            "View Source" : function (){
                alert($('<div>').append($(this).clone()).html());
            },
            "View Url" : function (){
                alert(url);
            }*/
        }
    });     

    $.get(url, function(data) {
        $("#dialog").html(data);
        $("#dialog").dialog('open');
    });
}

edit:

I use it with the following PHP to great effect

   if ($_SESSION['alert_message']){
        echo "<script>\n";
        echo " $(function() { \n";
        echo "   JQueryMessage('".str_replace("'","\'",$_SESSION['alert_message'])."'); \n";
        echo " }); \n";
        echo "</script>\n";
        unset($_SESSION['alert_message']);
    }

---

If you want to use Jquery Alert/ Confirm/Prompt Box check out this example.

Or even better You should use pop-up from jquery. It looks breliant with some CSS.

$('#errorBtn').click(function(e) {
    if (acceptCondition()=='on'){
        // Prevents the default action to be triggered. 
        e.preventDefault();                
        // Triggering bPopup when click event is fired
        $('#popup').bPopup({
            opacity: 0.6,
            zIndex: 200,
            modalClose: false,
            positionStyle: 'fixed'
        });

You have to include jquery.bpopup-0.7.0.min.js also :)
You can reed more here at dinbror.dk