API tools faq
paste
Advertisement
hsianghui

Lab 3 (customer_form.ejs)

hsianghui
Dec 26th, 2024 (edited)
140
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 3.44 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.   <head>
  4.     <meta charset="UTF-8" />
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6.     <link
  7.      href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
  8.      rel="stylesheet"
  9.    />
  10.     <title>Create A New Customer</title>
  11.   </head>
  12.  
  13.   <body>
  14.     <div class="container" style="margin-top: 20px">
  15.       <%- include("sidebar") %>
  16.       <div style="float: left">
  17.         <!-- prettier-ignore -->
  18.         <%
  19.          let formAction = '/customers/add' ;
  20.          let formLabel = 'Create A New Customer';
  21.          if (typeof _id !='undefined' ){
  22.            formAction = `/customers/${_id}/edit`;
  23.            formLabel = 'Edit Customer';
  24.          }
  25.        %>
  26.         <h1><%= formLabel %></h1>
  27.         <form
  28.          action="<%= formAction %>"
  29.           method="post"
  30.         >
  31.           <div class="mb-3 row">
  32.             <label for="name" class="col-sm-4 col-form-label">Name:</label>
  33.             <div class="col-sm-8">
  34.               <input
  35.                type="text"
  36.                class="form-control"
  37.                id="name"
  38.                name="name"
  39.                value="<%= typeof name != 'undefined' ? name : '' %>"
  40.                 required
  41.               />
  42.             </div>
  43.           </div>
  44.           <div class="mb-3 row">
  45.             <div class="col-sm-4 col-form-label">Gender:</div>
  46.             <div class="col-sm-8">
  47.               <!-- prettier-ignore -->
  48.               <%
  49.                let femaleChecked = "", maleChecked = "";
  50.                if (typeof gender != 'undefined' ) {
  51.                  if (gender === 1){
  52.                    femaleChecked="checked";
  53.                  } else if (gender === 2){
  54.                    maleChecked="checked";
  55.                  }
  56.                }
  57.              %>
  58.               <!-- prettier-ignore -->
  59.               <input
  60.                type="radio" class="form-check-input"
  61.                name="gender" value="1" id="female" <%= femaleChecked %>
  62.               />
  63.               <label for="female" class="form-check-label">Female</label>
  64.               <!-- prettier-ignore -->
  65.               <input
  66.                type="radio" class="form-check-input"
  67.                name="gender" value="2" id="male" <%= maleChecked %>
  68.               />
  69.               <label for="male" class="form-check-label">Male</label>
  70.             </div>
  71.           </div>
  72.           <div class="mb-3 row">
  73.             <label for="dob" class="col-sm-4 col-form-label"
  74.              >Date of Birth <br />
  75.               (yyyy-mm-dd):</label
  76.            >
  77.             <div class="col-sm-8">
  78.               <input
  79.                type="text"
  80.                class="form-control"
  81.                id="dob"
  82.                name="dob"
  83.                value="<%= typeof dob != 'undefined' ? dob.toISOString().split('T')[0] : '' %>"
  84.                 required
  85.               />
  86.             </div>
  87.           </div>
  88.           <div class="mb-3 row">
  89.             <div class="col-6">
  90.               <a href="/customers/list" class="btn btn-secondary">Cancel</a>
  91.             </div>
  92.             <div class="col-6 text-end">
  93.               <input class="btn btn-primary" type="submit" value="Submit" />
  94.             </div>
  95.           </div>
  96.         </form>
  97.       </div>
  98.     </div>
  99.  
  100.     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
  101.   </body>
  102. </html>
  103.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
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!