php - Bootstrap multiple models in same page give same for all models -


i have made 5 models in single page using bootstrap username,password,email,mobile , student different models buttons give same model of of username button change id in each element code

<div class="container"> <h2>account settings</h2>   <label class="control-label col-sm-10">username :  <?php $name =  $_session['username']; echo $name;?></label> <div class="col-sm-offset-4 col-sm-2"> <button type="button" class="btn btn-primary btn-block" data-toggle="modal"  data-target="#mymodal">change username</button>   </div> <div class="modal fade" id="mymodal" role="dialog"> <div class="modal-dialog">   <div class="modal-content">     <div class="modal-header">        <button type="button" class="close" data-dismiss="modal">&times; </button>        <h4 class="modal-title">change username</h4>     </div>     <div class="modal-body">       <center>old username:  <?php $name = $_session['username']; echo  $name;?></center><br>       new username : <input type="text">       <div class="modal-footer">     </div>     </div>   </div> </div> </div> </div> <div class="container">   <label class="control-label col-sm-10">password :  <?php $name =    $_session['password']; echo $name;?></label> <div class="col-sm-offset-4 col-sm-2"> <button type="button" class="btn btn-primary btn-block" data-toggle="modal"  data-target="#mymodal">change password</button>   </div> <div class="modal hide fade" id="modal2" tabindex="-1" role="dialog" aria- labelledby="mymodallabel" aria-hidden="true" style="display: none;"> <div class="modal-dialog">   <div class="modal-content">     <div class="modal-header">        <button type="button" class="close" data-dismiss="modal">&times; </button>        <h4 class="modal-title">change password</h4>     </div>     <div class="modal-body">       <img id="myimg" src="1.jpg" alt="trolltunga, norway" width="400"  height="300">       <div class="modal-footer">     </div>     </div>   </div> </div>  </div>  </div> <div class="container">   <label class="control-label col-sm-10">email :  <?php $name =  $_session['email']; echo $name;?></label> <div class="col-sm-offset-4 col-sm-2"> <button type="button" class="btn btn-primary btn-block" data-toggle="modal"  data-target="#mymodal">change email</button>   </div> <div class="modal fade" id="mymodal3" role="dialog"> <div class="modal-dialog">   <div class="modal-content">     <div class="modal-header">        <button type="button" class="close" data-dismiss="modal">&times;      </button>        <h4 class="modal-title">modal header</h4>     </div>     <div class="modal-body">       <img id="myimg" src="1.jpg" alt="trolltunga, norway" width="400"     height="300">       <div class="modal-footer">     </div>     </div>   </div>  </div>  </div>  </div>  <div class="container">   <label class="control-label col-sm-10">mobile numb:  <?php $name =   $_session['mobile']; echo $name;?></label>  <div class="col-sm-offset-4 col-sm-2">  <button type="button" class="btn btn-primary btn-block" data-toggle="modal"   data-target="#mymodal">change mobile</button>   </div>   <div class="modal fade" id="mymodal4" role="dialog">   <div class="modal-dialog">   <div class="modal-content">     <div class="modal-header">        <button type="button" class="close" data-dismiss="modal">&times;   </button>        <h4 class="modal-title">modal header</h4>     </div>     <div class="modal-body">       <img id="myimg" src="1.jpg" alt="trolltunga, norway" width="400"     height="300">       <div class="modal-footer">     </div>     </div>   </div> </div> </div> </div><br> <div class="container"> <div class="col-sm-offset-4 col-sm-2"> <button type="button" class="btn btn-primary btn-block" data-toggle="modal"  data-target="#mymodal">add student</button>   </div> <div class="modal fade" id="mymodal5" role="dialog"> <div class="modal-dialog">   <div class="modal-content">     <div class="modal-header">        <button type="button" class="close" data-dismiss="modal">&times; </button>        <h4 class="modal-title">modal header</h4>     </div>     <div class="modal-body">       <img id="myimg" src="1.jpg" alt="trolltunga, norway" width="400"  height="300">       <div class="modal-footer">     </div>     </div>   </div> </div> </div> </div> </body> 

add related ids in buttons well. targeting mymodal

<button type="button" class="btn btn-primary btn-block" data-toggle="modal"   data-target="#mymodal">change mobile</button> <button type="button" class="btn btn-primary btn-block" data-toggle="modal"   data-target="#mymodal4">change mobile</button> 

Comments

Popular posts from this blog

node.js - Node js - Trying to send POST request, but it is not loading javascript content -

javascript - Replicate keyboard event with html button -

javascript - Web audio api 5.1 surround example not working in firefox -