CODEWITHSUNDEEP
jqueryuser-interfacecookiesmodal-dialog
Dan R
Dan R

Reputation: 21

Setting a Cookie For JQuery UI Modal Dialog

We have a JQuery UI Modal Dialog when signing into our internet banking product to display a message. This pops up every single time. Now we want to make this cookie-based so a user only sees this box once until their cookies are cleared. How can I achieve this?

<body onLoad="loadPage();" onUnload="unloadPage();">
<script>

$(function() {
    // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
    //$( "#dialog:ui-dialog" ).dialog( "destroy" );


    $( "#dialog-modal" ).dialog({
        height: 475,
        width: 550,
        position: 'top',
        modal: true,
        buttons:{ "Close": function() { $(this).dialog("close"); } },
        draggable: false,
        resizable: false
    });

});


</script>

IMPORTANT MESSAGE FOR ATM/DEBIT CARD HOLDERS

Federal Regulations recently changed, which means we are required to get your permission to consider paying overdrafts on your everyday debit transactions.

Please click here to find out important information regarding overdraft charges and debit card transactions.

Upvotes: 2

Views: 1258

Answers (2)

YoJey Thilipan
YoJey Thilipan

Reputation: 687

When click the close button , cookie will stored as( Cookie name = subscribe_popup_status ) value( shown )

$.cookie("cookie_name", "cookie_value");

$( '.home_page_popup' ).dialog({ 
   autoOpen: false,
   closeText: "",
   modal: true,
   resizable: false,
   icon: "ui-icon-heart",
   classes: {
       "ui-dialog": "home_page_popup_dialog"
   },
   width: pop_up_width
});

$(".home_page_popup").on("click",".popup_close",function() {

    if ($.cookie('subscribe_popup_status') == null) {
       $.cookie('subscribe_popup_status', 'shown',{ expires: popup_duration });
    }

    $( '.home_page_popup' ).dialog('close');

});

Upvotes: 0

Chad
Chad

Reputation: 19609

Most simply you can create a cookie to store whether they have seen it or not using the jQuery Cookie Plugin:

//Set a cookie value
$.cookie('seen', 'yes');

//get the value
var seen = $.cookie('seen');
if(seen == null) { /*have not seen, show modal*/ }

//delete cookie
$.cookie('seen', null);

Upvotes: 1

Related Questions