Before open bootstrap modal redirect to another page

Question

I have one button in which i have put below code :

<a href="#thread_add_modal" class="btn btn-primary" id="thread_add_id" data-toggle="modal">New Thread</a>

Any person is able to create thread once they logged in.Without logged in i cant allow user to create thread.

Javascript :

$("#thread_add_id").click(function(){
         var login = "<?php echo $this->session->userdata('login')?>";
         if(login == false){
             window.location.href = "<?php echo base_url()?>login/";
         }


     });

Problem :

When i am trying to click on New thread without login that time its first open popup and then redirect to login page.
I dont want to show that popup before logged in.

For that purpose i have done like above.But its not working properly for me. so any idea, any suggestions.

Answer 1

First of all remove data-toggle="modal" from anchor tag and add class clsmodal we'll open modal on click of jquery event see below snippet i have just pass var login = true; to make this fiddle work you just put your PHP code there if login is true modal pop up will show otherwise it will redirected

 jQuery(document).ready(function(e) { $(".clsmodal").on("click", function() { var login = true; if (login == false) { window.location.href = "<?php echo base_url()?>login/"; } else { $('#myModal').modal('show'); } }); }); 

 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> <!-- Button trigger modal --> <button type="button" id="mymodal" class="btn btn-primary btn-lg clsmodal"> Launch demo modal </button> <!-- Modal --> <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> <h4 class="modal-title" id="myModalLabel">Modal title</h4> </div> <div class="modal-body"> ... </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="button" class="btn btn-primary">Save changes</button> </div> </div> </div> </div> 

Answer 2

1) Remove Bootstrap attributes from your button

<a  class="btn btn-primary" id="thread_add_id" >New Thread</a>

2 Detect if user is logged than redirect. Else refer your modal to show $('#thread_add_modal').modal('show');

$("#thread_add_id").click(function(){
   var login = "<?php echo $this->session->userdata('login')?>";
   if(login == false){
       window.location.href = "<?php echo base_url()?>login/";
   }
   else{
       $('#thread_add_modal').modal('show'); 
   }

});