Self-Registered Guest Portal Modal AUP text

[rodrigomarques222820]

Hello,

I was doing the following script to open the AUP text on a modal window on the self register page. This script requires the user to open the terms and conditions to enable the "I agree to the terms and conditions" checkbox

<script src="customFiles/jquery-modal.js" type="text/javascript"></script><script>
$( document ).ready(function() {
 $(".ui-checkbox").addClass("ui-disabled");
$("#aupAccepted").attr("disabled", "disabled");
$("a[href='AupView.action?from=SELF_REGISTRATION']").attr("rel", "modal:open");
$("a[href='AupView.action?from=SELF_REGISTRATION']").attr("target", "");
$("a[href='AupView.action?from=SELF_REGISTRATION']").attr("href", "#modal_terms");

$("a[href='#modal_terms'").on("click", function(){
    $(".ui-checkbox").removeClass("ui-disabled");
    $("#aupAccepted").removeAttr("disabled");
});
});
</script>

<link href="customFiles/jquery-modal.css" rel="stylesheet"></link>

<div class="modal" id="modal_terms" style="max-width:800px !important;padding:50px 40px 20px 20px;">
  
<!-- INSERT AUP TEXT HERE -->

<a class="ui-btn ui-shadow ui-btn-corner-all ui-btn-up-a" href="#" rel="modal:close" style="line-height:28px">Close</a>

</div>

The the ZIP file attached have two files that needs to be uploaded to ISE custom files (jquery-modal.js and jquery-modal.css).

The modal window have just one problem on Iphone captive browser. When open the window don't show the (X) to close and the button "CLOSE".I'm still trying to find a workaround for this.

Best regards

[Jason Kunst · Accepted solution]

is this a question or are you just sharing information? If you are sharing information you can write a document or a blog

[rodrigomarques222820]

Hello,

I'm sorry I was not cleared, its was a question to know if anyone knows if on iOS captive portals needed any special code to accept url links

[Jason Kunst]

I think its unlikely that it would work with them but I’ll check

[sivsivar]

Hi,

Can you please share the below details to check the issue more.
1. ISE version with patch version which you are using
2. Have you created the portal from ISE Portal Builder? If yes please share the portal name and CCO ID.
3. In which page the script is added?

Thanks,
Sivakami.

[rodrigomarques222820]

Hello,
Thanks for your answer.

1. ISE version is 2.3.0.298 with 2 and 4 patches
2. I didn't use ISE Portal Builder
3. I applied the script on page "Registration Form" inside the "Optional Content 2"

Thanks,
Rodrigo

[sivsivar]

Hi,

When I tried to reproduce the issue, close buttons work fine in iphones as well as android for the first time. But when i try the same once after clicking on cancel button, i face the issue close buttons not working. When you click outside of modal window, window gets closed. So can you please confirm whether you are facing the issue only in iphones mini browser or facing issue in all devices once after clicking on Cancel button.

Thanks,

Sivakami.

[sivsivar · Accepted solution]

Hi,

As I said in the last mail, the close buttons are not working for all devices. Able to reproduce the issue even in Portal test URL.

To fix this issue please try the below scripts in Login and Registration page.

Login page
=========

<script>
    $( document ).ready(function() {
        if($("#modal_terms") != null){
            $("#modal_terms").remove();
        }
    });
</script>

Registration page

==================

<script src="customFiles/jquery-modal.js" type="text/javascript"></script><script>
$( document ).ready(function() {

$(".ui-checkbox").addClass("ui-disabled");
$("#aupAccepted").attr("disabled", "disabled");

$("a[href='AupView.action?from=SELF_REGISTRATION']").attr("rel", "modal:open");
$("a[href='AupView.action?from=SELF_REGISTRATION']").attr("target", "");
$("a[href='AupView.action?from=SELF_REGISTRATION']").attr("href", "#modal_terms");

$("a[href='#modal_terms'").on("click", function(){
    $(".ui-checkbox").removeClass("ui-disabled");
    $("#aupAccepted").removeAttr("disabled");
});
});

</script>
<link href="customFiles/jquery-modal.css" rel="stylesheet"></link>

<div class="modal" id="modal_terms" style="max-width:800px !important;padding:50px 40px 20px 20px;">
  
<!-- INSERT AUP TEXT HERE -->

<a class="ui-btn ui-shadow ui-btn-corner-all ui-btn-up-a" href="#" onclick="$.modal.close();" rel="modal:close" style="line-height:28px">Close</a></div>

Also attached the modified jquery-modal.js file. Please try to do all the modifications and check whether it works as expected.

[rodrigomarques222820]

Thanks so much for your help! Its working perfectly!!