Real Estate Landing - Copy this Html, Bootstrap Component to your project
<div class="modal fade" id="addEstateModal" tabindex=" 1" role="dialog" aria labelledby="addEstateModalLabel" aria hidden="true"> <div class="modal dialog" role="document"> <div class="modal content"> <div class="modal header"> <h5 class="modal title">Add New Estate</h5> <button type="button" class="close" data dismiss="modal" aria label="Close"> <span aria hidden="true">×</span> </button> </div> <form id="formAddEstate"> <div class="modal body"> <! Title > <div class="form group"> <label for="title">Title</label> <input type="text" class="form control" name="title" id="title" placeholder="Enter estate title" required minlength="3"> </div> <! Price > <div class="form group"> <label for="price">Price</label> <input type="number" class="form control" name="price" id="price" placeholder="Enter estate price" required> </div> <! Surface > <div class="form group"> <label for="surface">Surface</label> <input type="number" class="form control" name="surface" id="surface" placeholder="Enter estate surface area" required> </div> <! Rooms > <div class="form group"> <label for="rooms">Rooms</label> <input type="number" class="form control" name="rooms" id="rooms" placeholder="Enter number of rooms" required> </div> <! Bathrooms > <div class="form group"> <label for="bathrooms">Bathrooms</label> <input type="number" class="form control" name="bathrooms" id="bathrooms" placeholder="Enter number of bathrooms" required> </div> <! Estate Type (Select) > <div class="form group"> <label for="estateTypeId">Estate Type</label> <select class="form control" name="estateTypeId" id="estateTypeId" required> <option value="">Select Estate Type</option> <! Estate types will be dynamically populated here > <option th:each="type : ${estateTypes}" th:value="${type.estateTypeId}" th:text="${type.typeName}"></option> </select> </div> <! Street Name > <div class="form group"> <label for="streetName">Street Name</label> <input type="text" class="form control" name="streetName" id="streetName" placeholder="Enter estate street name" required> </div> <! Description > <div class="form group"> <label for="description">Description</label> <textarea class="form control" name="description" id="description" placeholder="Enter estate description" rows="3" required></textarea> </div> <! Status (Select) > <div class="form group"> <label for="status">Status</label> <select class="form control" name="status" id="status" required> <option value="AVAILABLE">Available</option> <option value="UNAVAILABLE">Unavailable</option> </select> </div> <! City, District, ward > <div th:replace="~{fragments/address :: address}"></div> <button type="button" class="btn btn primary" onclick="addEstate(this)">Add Estate</button> </div> </form> </div> </div> </div> `chỉnh sửa lại 1 trang đẹp`
