Ticket Management System Administration Portal | Part 9 | Rent Page Code

Rent

Overview

This page will show information about rent. It has four parts new rent, search, update, and delete rent.

Location wise rent will set. 

 <div id = "rent_panel" class = "col-md-12 display-none" >

<nav id = "rent_nav" class = "nav nav-pills nav-stacked my-3" >

<a id = "new_rent_nav_link" class = "nav-link" href = "#" >New</a>

<a id = "search_rent_nav_link" 

class = "nav-link" 

href = "#" > Search

</a>

<a id = "update_rent_nav_link" 

class = "nav-link" 

href = "#" > Update </a>

<a id = "delete_rent_nav_link" 

class = "nav-link"

href = "#" > Delete </a>

</nav>

<div class = "row" >

<div class = "col-md-12" >

<div class = "card bg-grey-500" >

<div class = "card-header" >

<strong id = "rent_header_text" ></strong>

</div>

</div>

</div>

<div id = "display_rent_panel" class = "col-md-12 my-3" >

<div class = "card" >

<div class = "card-body" >

<table class = "table table-bordered" >

<thead class = "thead-inverse" >

<tr >

<th >#</th>

<th >Rent</th>

<th >From</th>

<th >To</th>

</tr>

</thead>

<tbody>

<tr >

<td scope = "row" ></td>

<td ></td>

<td ></td>

<td ></td>

</tr>

</tbody>

</table>

</div>

</div>

</div>

<div id = "new_rent_panel" class = "col-md-12 my-3" >

<div class = "card" >

<div class = "card-body" >

<div class = "row" >

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "" >From</label >

<input type = "text" name = "" id = "" class = "form-control" placeholder = ""

aria-describedby = "helpId" >

<small id = "helpId" class = "text-muted" > Validation Message Goes here </small >

</div >

</div >

<div class = "col-md-6" >

 Validation Message Goes here

</div >

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "" >To</label >

<input type = "text" name = "" id = "" class = "form-control" placeholder = ""

aria-describedby = "helpId" >

<small id = "helpId" 

class = "text-muted" >

Validation Message Goes here

</small >

</div >

</div >

<div class = "col-md-6" > Validation Message Goes here </div>

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "" > Amount </label>

<input type = "text" 

name = "" 

id = "" 

class = "form-control" 

placeholder = ""

aria-describedby = "helpId" >

<small id = "helpId" class = "text-muted" > Validation Message Goes here </small >

</div>

</div>

<div class = "col-md-6" > Validation Message Goes here </div>

<div class = "col-md-6" >

<button class = "btn btn-success w-25 float-right" > Save </button>

</div>

</div>

</div>

</div>

</div>

<div id = "search_rent_panel" class = "col-md-12 my-3">

<div class = "card" >

<div class = "card-body" >

<div class = "row" >

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "my-input" > Select City </label>

<input id = "my-input" class = "form-control" type = "text" name = "">

<small id = "helpId" class = "text-muted" > Validation Message Goes here </small >

</div >

</div >

<div class = "col-md-6" > Validation Message Goes here </div>

<div class = "col-md-6" >

<button class = "btn btn-success w-25 float-right" > Search </button>

</div>

<div class = "col-md-12 my-3 mx-0 p-0" >

<div class = "card-footer border-0 p-0" >

<div class = "alert alert-primary" role = "alert" > Content </div>

</div>

<div class = "card-body p-0" >

<div class = "card" >

<div class = "card-body p-0" >

<table class = "table table-bordered m-0" >

<thead class = "thead-inverse" >

<tr>

<th> # </th>

<th> From </th>

<th> To </th>

<th> To </th>

<th> Rent </th>

</tr>

</thead>

<tbody>

<tr>

<td scope = "row" ></td >

<td> </td>

<td> </td>

<td> </td>

<td> </td>

</tr>

</tbody>

</table>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

</div>

<div id = "update_rent_panel" class = "col-md-12 my-3" >

<div class = "card" >

<div class = "card-body">

<div class = "row" >

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "my-input" > Enter Route ID </label >

<input id = "my-input" class = "form-control" type = "text" name = "" >

<small class = "form-text text-muted" > Validation Message Goes here </small>

</div>

</div>

<div class = "col-md-6" > Validation Message Goes here.</div>

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "my-input" > From </label>

<input id = "my-input" class = "form-control" type = "text" name = "" >

<small class = "form-text text-muted" >Validation Message Goes here</small>

</div >

</div >

<div class = "col-md-6" > Validation Message Goes here. </div>

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "my-input" > To </label>

<input id = "my-input" class = "form-control" type = "text" name = "" >

<small class = "form-text text-muted" > Validation Message Goes here </small>

</div>

</div>

<div class = "col-md-6" > Validation Message Goes here. </div>

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "my-input" > Rent </label>

<input id = "my-input" class = "form-control" type = "text" name = "" >

<small class = "form-text text-muted" > Validation Message Goes here </small >

</div>

</div>

<div class = "col-md-6" > Validation Message Goes here. </div>

<div class = "col-md-6" >

<button class = "btn btn-success w-25 float-right" > Save </button >

</div>

</div>

</div>

</div>

</div>

<div id = "delete_rent_panel" class = "col-md-12 my-3" >

<div class = "card" >

<div class = "card-body" >

<div class = "row" >

<div class = "col-md-6" >

<div class = "form-group" >

<label for = "my-input" > Enter Route ID </label >

<input id = "my-input" class = "form-control" type = "text" name = "" >

<small class = "form-text text-muted" > Validation Message Goes here </small>

</div>

</div>

<div class = "col-md-6" > Validation Message Goes here </div>

<div class = "col-md-6" >

<button class = "btn btn-success w-25 float-right" > Submit </button >

</div>

</div>

</div>

</div>

</div>

</div>

</div>

Output:

Rent View

Rent Collapse View

Rent New View

Rent Search View

Rent Update View

Rent Delete View