API tools faq
paste
Guest User

CRUD Modal Bootstrap index.php

a guest
May 26th, 2018
8,761
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
PHP 3.46 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <title>CRUD Modal Bootstrap</title>
  5.     <link rel="stylesheet" type="text/css" href="style/bootstrap.css">
  6. </head>
  7. <body>
  8.  
  9.  
  10. <div class="container" style="margin-top:8%">
  11.     <div class="row">
  12.         <div class="col-md-8 col-md-offset-2">
  13.             <p>
  14.                 <center>
  15.                     <h2>Crud Modal Jquery Sederhana</h2>
  16.                     Oleh : <a href="https://www.facebook.com.pendeta.mokong" target="_blank">Rully Studio</a>
  17.                 </center>
  18.             </p>
  19.             <br>
  20.             <p>
  21.                 <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#modal-tambah">Add New</button>
  22.             </p>
  23.                 <div id="data-mahasiswa">
  24.                 </div>
  25.         </div>
  26.     </div>
  27.     <p>
  28.     <center>Copyright @ 2018 by : <a href="https://www.facebook.com.pendeta.mokong" target="_blank">Rully Studio</a> All rights reserved.</center>
  29.     </p>
  30. </div>
  31.     <script type="text/javascript" src="style/jquery.js"></script>
  32.     <script type="text/javascript" src="style/bootstrap.js"></script>  
  33.     <script type="text/javascript" src="script.js"></script>   
  34. </body>
  35. </html>
  36.  
  37.  
  38.  
  39.     <div id="modal-tambah" class="modal fade" role="dialog">
  40.         <div class="modal-dialog modal-lg">
  41.             <div class="modal-content">
  42.                 <form role="form" id="form-tambah" method="post" action="input.php">
  43.                 <div class="modal-header">
  44.                     <button type="button" class="close" data-dismiss="modal">&times;</button>
  45.                     <h4 class="modal-title">Menambahkan Mahasiswa</h4>
  46.                 </div>
  47.                     <div class="modal-body">
  48.                        
  49.                         <div class="form-group">
  50.                             <label>Nama</label>
  51.                             <input class="form-control" id="nama" name="nama">
  52.                             <p style="color:red" id="error_nama"></p>
  53.                         </div>
  54.                         <div class="form-group">
  55.                             <label>Jenis Kelamin</label>
  56.                             <div class="radio">
  57.                                 <label>
  58.                                     <input type="radio" name="jenis_kelamin" value="Laki-laki" checked>Laki-laki
  59.                                 </label>
  60.                             </div>
  61.                             <div class="radio">
  62.                                 <label>
  63.                                     <input type="radio" name="jenis_kelamin" value="Perempuan">Perempuan
  64.                                 </label>
  65.                             </div>
  66.                             <p style="color:red" id="error_jenis_kelamin"></p>
  67.                         </div>
  68.                         <div class="form-group">
  69.                             <label>Telepon</label>
  70.                             <input class="form-control" id="telepon" name="telepon">
  71.                             <p style="color:red" id="error_telepon"></p>
  72.                         </div>
  73.                         <div class="form-group">
  74.                             <label>Alamat</label>
  75.                             <textarea id="alamat" name="alamat" class="form-control" rows="3"></textarea>
  76.                             <p style="color:red" id="error_alamat"></p>
  77.                         </div>                         
  78.                                        
  79.                     </div>
  80.                    
  81.                     <div class="modal-footer">
  82.                         <button type="button" class="btn btn-info" data-dismiss="modal">Batal</button>
  83.                         <button type="submit" class="btn btn-primary" >Simpan</button>
  84.                     </div>
  85.                 </form>    
  86.             </div>
  87.         </div>
  88.     </div>
  89.    
  90.    
  91.     <div id="modal-edit" class="modal fade" role="dialog">
  92.         <div class="modal-dialog modal-lg">
  93.             <div class="modal-content">
  94.                 <form role="form" id="form-edit" method="post" action="input.php">
  95.                 <div class="modal-header">
  96.                     <button type="button" class="close" data-dismiss="modal">&times;</button>
  97.                     <h4 class="modal-title">Menambahkan Mahasiswa</h4>
  98.                 </div>
  99.                     <div class="modal-body">
  100.                         <div id="data-edit">
  101.                        
  102.                         </div>             
  103.                     </div>
  104.                    
  105.                     <div class="modal-footer">
  106.                         <button type="button" class="btn btn-info" data-dismiss="modal">Batal</button>
  107.                         <button type="submit" class="btn btn-primary" >Simpan</button>
  108.                     </div>
  109.                 </form>    
  110.             </div>
  111.         </div>
  112.     </div>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!