JSFiddle - React, Tailwind, and code Playground

by ysuper

HTML

<!DOCTYPE html>
<html>

  <head>
    <title>Create Page</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    <style>
      .form-group:nth-of-type(7) {
        /* 銷退單單身 */
        display: none;
      }

      .form-group:nth-of-type(8) {
        /* 銷退單單身儲存結果區域 */
        display: none;
      }

    </style>
  </head>

  <body>
    <div class="container">

      <form onkeydown="if(event.keyCode==13)return false;" action="" method="POST" role="form" class="admin-form form-horizontal" enctype="multipart/form-data">
        <h1>
          <center>【RMA銷退系統】</center>
        </h1>
        <h2>
          <center><b>建立銷退單</b></center>
        </h2>
        <div class="form-group"><label for="form_type" class="col-md-1 control-label">單別</label>
          <div class="col-md-11"><input class="form-control" id="form_type" name="form_type" value="241" readonly></div>
        </div>
        <div class="form-group"><label for="form_no" class="col-md-1 control-label">單號</label>
          <div class="col-md-11"><input class="form-control" id="form_no" name="form_no" readonly></div>
        </div>
        <div class="form-group"><label for="return_date" class="col-md-1 control-label">退貨日期</label>
          <div class="col-md-11"><input class="form-control" id="return_date" name="return_date" placeholder="請輸入退貨日期" required></div>
        </div>
        <div class="form-group"><label for="customer_shortname" class="col-md-1 control-label">客戶(簡稱)</label>
          <div class="col-md-11"><input class="form-control" id="customer_shortname" name="customer_shortname" required></div>
        </div>
        <div class="form-group"><label for="customer_fullname" class="col-md-1 control-label">客戶(全名)</label>
          <div class="col-md-11"><input class="form-control" id="customer_fullname" name="customer_fullname" readonly></div>
       ...