How do I add a 2nd modal to my html page

Question

I didn\'t explain my problem in my last post.

So I want to add a second modal to my html page so if you click on \"Button 1\" it would open \"Modal 1\" and if you click

Answer 1

You don't need to write javascript to hide or show modals use the right data-target and data-toggle in the button tag as shown below and bootstrap will automatically do the rest.

Open Large Modal

Open Large Modal

Set data-toggle="modal" and data-target='' inside the button tag as shown above.

To show two modal for two buttons just add the id of new modal in the data-target='' attribute in the new button.

Now create multiple modals and give each of them a different

  

    

      

        


            YOUR MODAL HTML CODE

        
    
  

UPDATED: ADDING CLOSE BUTTON TO CLOSE THE MODAL BY BOOTSTRAP

Replace × in your modal with

×

it will close the modal automatically on clicking close button on the modal.

Here is an example of how to use two modals

  
  
  
  
  
  




  
Large Modal
  
  Open Large Modal
  Open Large Modal

  
  

    

      

        

          
    		

      		

        		×
        		E-mail:
        		
      		
      		

        		Username:
        	

        	
        
      		
      		

        		Password:
        	

        		
      		
      		

              Confirm Password:
              

              
      		
      		

              3 Hashtags:
              

                 
      	   
          

            
          
    	
        
      
    
  


 
  

    

      

        

           

    

      ×
      Example:
      
    
    

      Example2:
      

      
    
    

      Example3:
      

      
    
    

      Example4:
      

      
    
    

      Example5: