index.html 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>AJAX</title>
  6. <link rel="stylesheet" type="text/css" href="https://bootswatch.com//3/slate/bootstrap.css">
  7. <script src="lib/jquery/dist/jquery.min.js"></script>
  8. <link rel="stylesheet" type="text/css" href="./css/style.css">
  9. </head>
  10. <body>
  11. <div class="container">
  12. <div class="row">
  13. <div class="col-sm-4">
  14. <div class="panel panel-primary">
  15. <div class="panel-heading">All students</div>
  16. <div class="list-group" id='students-list'>
  17. </div>
  18. <div class="panel-body">
  19. </div>
  20. </div>
  21. </div>
  22. <div class="col-sm-4">
  23. <div class="panel panel-success">
  24. <div class="panel-heading">Students info</div>
  25. <div class="panel-body">
  26. <form id="form-update">
  27. <input type="hidden" name="id">
  28. <div class="form-group">
  29. <label>Firstname</label>
  30. <input type="text" name="firstname" placeholder="firstname" class="form-control">
  31. </div>
  32. <div class="form-group">
  33. <label>Lastname</label>
  34. <input type="text" name="lastname" placeholder="Lastname" class="form-control">
  35. </div>
  36. <div class="form-group">
  37. <label>email</label>
  38. <input type="text" name="email" placeholder="email" class="form-control">
  39. </div>
  40. <div class="form-group">
  41. <label>gitLab</label>
  42. <input type="text" name="gitlab" placeholder="gitLab" class="form-control">
  43. </div>
  44. <div class="form-group">
  45. <label>group ID</label>
  46. <input type="text" name="group_id" disabled placeholder="group ID" class="form-control">
  47. </div>
  48. <div class="form-group">
  49. <label>description</label>
  50. <textarea name="description"class="form-control" > </textarea>
  51. </div>
  52. <button class="btn btn-info" id="btn-update">Update</button>
  53. <button class="btn btn-danger" id="btn-delete">Delete</button>
  54. </form>
  55. </div>
  56. </div>
  57. </div>
  58. <div class="col-sm-4">
  59. <div class="panel panel-primary">
  60. <div class="panel-heading">Add students</div>
  61. <div class="panel-body">
  62. <form id="form-update">
  63. <input type="hidden" name="id">
  64. <div class="form-group">
  65. <label>Firstname</label>
  66. <input type="text" name="firstname" placeholder="firstname" class="form-control">
  67. </div>
  68. <div class="form-group">
  69. <label>Lastname</label>
  70. <input type="text" name="lastname" placeholder="Lastname" class="form-control">
  71. </div>
  72. <div class="form-group">
  73. <label>email</label>
  74. <input type="text" name="email" placeholder="email" class="form-control">
  75. </div>
  76. <div class="form-group">
  77. <label>gitLab</label>
  78. <input type="text" name="gitlab" placeholder="gitLab" class="form-control">
  79. </div>
  80. <div class="form-group">
  81. <label>description</label>
  82. <textarea name="description"class="form-control" > </textarea>
  83. </div>
  84. <button class="btn btn-success" id="btn-add">Add</button>
  85. </form>
  86. </div>
  87. </div>
  88. </div>
  89. </div>
  90. </div>
  91. <script src="js/service.js"></script>
  92. <script src="js/main.js"></script>
  93. <script src="js/service.js"></script>
  94. </body>
  95. </html>