JQuery Modal Window Disappearing After Display
(Doc ID 1959929.1)
Last updated on JANUARY 14, 2022
Applies to:
Oracle WebCenter Portal - Version 11.1.1.8.0 to 11.1.1.8.0 [Release 11g]Information in this document applies to any platform.
Symptoms
Attempting to place a JQuery modal window example on a WebCenter Portal (WCP) page. When executed through WCP, the modal window appears, but then quickly disappears. The desired functionality is for the modal window to display without disappearing.
Executing the html through a browser works as expected (modal window displays). The functionality fails when the html is placed on a WebCenter Portal page.
Sample test case steps:
------------------------
1. Creat new Portal in WCP.
2. Creat new page.
3. Add HTML Markup task flow to the page (from Web Development).
4. Add the following code for the HTML Markup task flow:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Dialog Box Witout Close Button</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
</head>
<body>
<button id="dialog_trigger">open the dialog</button>
<div id="dialog" style="display:none;" title="Dialog Title"><iframe frameborder="0" scrolling="no" width="700" height="700" src="http://google.about.com/b/2013/04/01/google-nose.htm"></iframe></div>
<script>
$( "#dialog_trigger" ).click(function() {
$( "#dialog" ).dialog( "open" );
});
$("#dialog").dialog({
autoOpen: false,
position: 'center',
title: 'EDIT',
draggable: false,
width : 800,
height : 700,
resizable : true,
modal : true,
});
</script>
</body>
</html>
5. View the page.
6. Click on the 'open the dialog' button.
7. A window opens and then closes quickly.
Cause
To view full details, sign in with your My Oracle Support account. |
|
Don't have a My Oracle Support account? Click to get started! |
In this Document
| Symptoms |
| Cause |
| Solution |