Reputation: 587
I am developing web application in Angular 2. On button click I am trying to open popup. I am able to do it in JavaScript. I am trying now in Angular 2.
Below is my HTML code for popup inside main page.
<button id="myBtn">Open Modal</button>
<!-- The Modal -->
<div id="myModal" class="modal">
<!-- Modal content -->
<div class="modal-content">
<span class="close">×</span>
<p>Some text in the Modal..</p>
</div>
</div>
In main page I have one text box. When I open popup inside popup text box is also displaying as below.
Filter records text box is in html page and not in popup. Can someone help me to fix this issue? Thank you.
Upvotes: 1
Views: 126
Reputation: 1241
It sounds like you've applied a high z-index
to the filter records textbox and button; z-index
is a styling attribute that allows you to specify which things appear in front of others, by lowering the z-index
on your "Filter records" textbox/button they should sit behind the popup.
Read more on z-index
here: https://www.w3schools.com/cssref/pr_pos_z-index.asp
Upvotes: 1