bootstrap modal placing overlay on entire screen and modal content not accessible

I am trying to open iframe in a bootstrap modal, but when the modal loads the overlay covers the entire screen including the popup and making it in accessible.

i have a div,

<div id="edit_batch" class="BatchGridPopup"></div>

the contents of this div are loaded via a ajax call, which loads the iframe.

when the iframe loads, i call the event $("#edit_batch").modal()

but this makes the overlay take up entire screen and i am unable to do any action on the popup or the screen.

Any help would be appreciated. Thanks.