Saturday_Sharing_Front/views/partials/dashboard/modal.ejs

 <div class="modal fade" id="modal-form" tabindex="-1" role="dialog" aria-labelledby="modal-form" aria-hidden="true">
    <div class="modal-dialog modal- modal-dialog-centered modal-md" role="document">
       <div class="modal-content">
          <div class="modal-body p-0">
               <div class="card bg-secondary border-0 mb-0">
                  <div id="pickCategory" class="card-header bg-transparent pb-5">
                     <div class="text-muted text-center mt-2 mb-3"><small>Pilih Tipe Materi</small></div>
                     <div class="text-muted text-center mt-2 mb-3 bold"><strong>Sabtu</strong></div>
                     <div class="btn-wrapper text-center">
                        <a onhref="#" <% /* id="btnPintar" */ %> onclick="(function(){
                           alert('Masih dalam perkembangan!');
                            return false;
                        })();return false;" class="btn btn-neutral btn-icon">
                        <span class="btn-inner--icon"><img src="img/icons/pintar.png"></span>
                        <span class="btn-inner--text">Pintar</span>
                        </a>
                        <a href="#" id="btnSharing" class="btn btn-neutral btn-icon">
                        <span class="btn-inner--icon"><img src="img/icons/sharing.png"></span>
                        <span class="btn-inner--text">Sharing</span>
                        </a>
                     </div>
                  </div>
                  <div id="formPintar" class="hide card-body px-lg-5 py-lg-5">
                     <form role="form" id="formCreatePintar">
                        <input type="hidden" name="Category" value="Sharing">
                        <div class="text-center text-muted mb-4">
                           <small>Daftarkan Materi Saturday Pintar</small>
                        </div>
                        <div class="form-group mb-3">
                           <label for="modalCompanySelect" class="form-control-label">Company</label>
                           <div class="input-group input-group-merge input-group-alternative">
                              <div class="input-group-prepend">
                                 <span class="input-group-text"><i class="ni ni-istanbul"></i></span>
                              </div>
                              <select name="company" class="form-control modalCompanySelect">
                                 <option  value="">Please select your Company</option>
                                 <option  value="All">Semua</option>
                                 <% for(var i=0; i<companies.length; i++) {%>
                                    <option value="<%= companies[i].id %>"><%= companies[i].attributes.Name %></option>
                                 <% } %>
                               </select>
                           </div>
                        </div>
                        <div class="form-group">
                           <label for="modalDivisionSelect" class="form-control-label">Division</label>
                           <div class="input-group input-group-merge input-group-alternative">
                              <div class="input-group-prepend">
                                 <span class="input-group-text"><i class="ni ni-shop"></i></span>
                              </div>
                              <select name="division" class="form-control modalDivisionSelect" disabled>
                                 <option  value="">Please select your division</option>
                                 <option  value="All">Semua</option>
                              </select>
                           </div>
                        </div>
                        <div class="form-group">
                           <label for="title" class="form-control-label">Judul</label>
                           <div class="input-group input-group-merge input-group-alternative">
                              <div class="input-group-prepend">
                                 <span class="input-group-text"><i class="ni ni-books"></i></span>
                              </div>
                              <input name="Title" class="form-control" placeholder="Judul Materi" type="text" id="title">
                           </div>
                        </div>
                        <div class="form-group">
                           <label for="description" class="form-control-label">Tentang </label>
                           <textarea rows="3" name="Description" class="form-control" placeholder="Materi mengenai" type="text" id="description">
                           </textarea>
                        </div>
                        <div class="form-group">
                           <label for="date" class="form-control-label">Tanggal</label>
                           <div class="input-group input-group-merge input-group-alternative">
                              <div class="input-group-prepend">
                                 <span class="input-group-text"><i class="ni ni-calendar-grid-58"></i></span>
                              </div>
                              <input name="Presented" class="form-control" type="date" placeholder="Dipresentasikan pada" id="date">
                           </div>
                        </div>
                        <% /* %>
                        <div class="form-group">
                           <label for="formFile" class="form-control-label">File Gambar</label>
                           <div class="custom-file input-group input-group-merge input-group-alternative">
                              <div class="input-group-prepend">
                                 <span class="input-group-text"><i class="ni ni-image"></i></span>
                              </div>
                              <input multiple="multiple" accept="image/*" id="formFile" type="file" class="custom-file-input" lang="en">
                              <label class="custom-file-label" for="formFile">Masukkan file gambar saat presentasi</label>
                           </div>
                           <ul id="uploadedFile"></ul>
                        </div>
                        <div class="form-group">
                           <label for="formAttachment" class="form-control-label">File Materi</label>
                           <div class="custom-file input-group input-group-merge input-group-alternative">
                              <div class="input-group-prepend">
                                 <span class="input-group-text"><i class="ni ni-book-bookmark"></i></span>
                              </div>
                              <input multiple="multiple" id="formAttachment" type="file" class="custom-file-input" lang="en">
                              <label class="custom-file-label" for="formAttachment">Masukkan file bahan presentasi</label>
   
                           </div>
                           <ul id="uploadedAttachment"></ul>
                        </div>
                        <% */ %>
                        <div class="text-center">
                           <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                           <button type="submit" class="btn btn-primary">Save</button>
                        </div>
                        </form>
                  </div>
                  <div id="formSharing" class="hide card-body px-lg-5 py-lg-5">
                     <form role="form" id="formCreate">
                        <input class="categoryField" type="hidden" name="Category">
                     <div class="text-center text-muted mb-4">
                        <small>Isi Materi Saturday Sharing</small>
                     </div>
                     <div class="form-group mb-3">
                        <label for="presenter" class="form-control-label">Presenter</label>
                        <div class="input-group input-group-merge input-group-alternative">
                           <div class="input-group-prepend">
                              <span class="input-group-text"><i class="ni ni-single-02"></i></span>
                           </div>
                           <input name="Name" class="form-control" placeholder="Dipresentasikan oleh" type="text" id="presenter">
                        </div>
                     </div>
                     <% if (locals.role == 'Sub-Admin'){ %>
                        <input type="hidden" name='company' value="<%= locals.company %>">
                     <% } else{ %>
                        <div class="form-group">
                           <label for="modalCompanySelect" class="form-control-label">Company</label>
                           <div class="input-group input-group-merge input-group-alternative">
                              <div class="input-group-prepend">
                                 <span class="input-group-text"><i class="ni ni-istanbul"></i></span>
                              </div>
                              <select name="company" class="form-control modalCompanySelect">
                                 <option  value="">Please select your Company</option>
                                 <% for(var i=0; i<companies.length; i++) {%>
                                    <option value="<%= companies[i].id %>"><%= companies[i].attributes.Name %></option>
                                 <% } %>
                               </select>
                           </div>
                        </div>
                      <% } %>
                     <% if (locals.role == 'Sub-Admin'){ %>
                        <input type="hidden" name='division' value="<%= locals.division %>">
                     <% } else{ %>
                        <div class="form-group">
                           <label for="modalDivisionSelect" class="form-control-label">Division</label>
                           <div class="input-group input-group-merge input-group-alternative">
                              <div class="input-group-prepend">
                                 <span class="input-group-text"><i class="ni ni-shop"></i></span>
                              </div>
                              <select name="division" class="form-control modalDivisionSelect" disabled>
                                 <option  value="">Please select your division</option>
                               </select>
                           </div>
                        </div>
                      <% } %>
                     <div class="form-group">
                        <label for="title" class="form-control-label">Judul</label>
                        <div class="input-group input-group-merge input-group-alternative">
                           <div class="input-group-prepend">
                              <span class="input-group-text"><i class="ni ni-books"></i></span>
                           </div>
                           <input name="Title" class="form-control" placeholder="Judul Materi" type="text" id="title">
                        </div>
                     </div>
                     <div class="form-group">
                        <label for="description" class="form-control-label">Tentang </label>
                        <textarea rows="3" name="Description" class="form-control" placeholder="Materi mengenai" type="text" id="description">
                        </textarea>
                     </div>
                     <div class="form-group">
                        <label for="date" class="form-control-label">Tanggal</label>
                        <div class="input-group input-group-merge input-group-alternative">
                           <div class="input-group-prepend">
                              <span class="input-group-text"><i class="ni ni-calendar-grid-58"></i></span>
                           </div>
                           <input name="Presented" class="form-control" type="date" placeholder="Dipresentasikan pada" id="date">
                        </div>
                     </div>
                     <div class="form-group">
                        <label for="join-form" class="form-control-label">File absensi</label>
                        <div class="custom-file input-group input-group-merge input-group-alternative">
                           <div class="input-group-prepend">
                              <span class="input-group-text"><i class="ni ni-badge"></i></span>
                           </div>
                           <input accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" type="file" class="custom-file-input" id="join-form" lang="en">
                           <label class="custom-file-label" for="join-form">Masukkan file excel absensi</label>
                        </div>
                        <small id="participantCounter"></small>
                        <input type="hidden" name="ParticipantList"/>
                     </div>
                     <div class="form-group">
                        <label for="videoFile" class="form-control-label">Video Presentasi</label>
                        <div class="custom-file input-group input-group-merge input-group-alternative">
                           <div class="input-group-prepend">
                              <span class="input-group-text"><i class="ni ni-camera-compact"></i></span>
                           </div>
                           <input accept="video/*" id="videoFile" type="file" class="custom-file-input" lang="en">
                           <label class="custom-file-label" for="videoFile">Masukkan file video presentasi</label>
                        </div>
                     </div>
                     <div class="form-group">
                        <label for="formFile" class="form-control-label">File Gambar</label>
                        <div class="custom-file input-group input-group-merge input-group-alternative">
                           <div class="input-group-prepend">
                              <span class="input-group-text"><i class="ni ni-image"></i></span>
                           </div>
                           <input multiple="multiple" accept="image/*" id="formFile" type="file" class="custom-file-input" lang="en">
                           <label class="custom-file-label" for="formFile">Masukkan file gambar saat presentasi</label>
                        </div>
                        <ul id="uploadedFile"></ul>
                     </div>
                     <div class="form-group">
                        <label for="formAttachment" class="form-control-label">File Materi</label>
                        <div class="custom-file input-group input-group-merge input-group-alternative">
                           <div class="input-group-prepend">
                              <span class="input-group-text"><i class="ni ni-book-bookmark"></i></span>
                           </div>
                           <input multiple="multiple" id="formAttachment" type="file" class="custom-file-input" lang="en">
                           <label class="custom-file-label" for="formAttachment">Masukkan file bahan presentasi</label>

                        </div>
                        <ul id="uploadedAttachment"></ul>
                     </div>
                     <div class="text-center">
                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                        <button type="submit" class="btn btn-primary">Save</button>
                     </div>
                     </form>
                  </div>
               </div>
          </div>
       </div>
   </div>
</div>