Take the 2-minute tour ×

On clicking a Button i want to show a Modal Window.

This is what i have implemented.

<a class="btn addIdeaBtn" data-toggle="modal" href="#addIdea" >Launch Modal</a> 
<!-- Model Window
<!-- Placed at the end of the document so the pages load faster -->
<div class="modal hide fade in" id="addIdea">
  <div class="modal-header">
    <button class="close" data-dismiss="modal">×</button>
    <h3>Add Idea</h3>
  <div class="modal-body">
    <form action="" method="post">
      <textarea id="addIdeaPopUp" class="tinymce" name="" cols="" rows=""></textarea>
  <div class="modal-footer"> <a href="home.html" class="btn">Close</a> <a href="home.html" class="btn btn-primary">Add Idea</a> </div>

When i click the Button the modal window appears and then vanishes :P


The button is at the bottom of the screen to the left sticking as a footer.

share|improve this question
add comment

2 Answers

up vote 3 down vote accepted

Try removing the in class from your modal. The JS automatically toggles between hide and in. Since your button is set to toggle the modal, it disappears, because it believes it is visible.

Meaning: <div class="modal hide fade" id="addIdea">

share|improve this answer
add comment

I am not exactly sure why it is happening without seeing more source code... but: Adding the class "tinymce" to your text area is what is causing the window to vanish.

Something with tinymce must be conflicting with bootstrap.

You may need to manually initialize bootstraps modal window or be careful about how tinymce is initializing itself.

Hopefully this is enough to get you down the right path.

share|improve this answer
thats just a class. we havent included TunyMCE into the project yet. –  Harsha M V May 14 '12 at 9:18
add comment

Your Answer


