Get HTML

Get CSS

Get JS

Checkout page with materialize

746 06 December 2019

No Description Available

Abhishek Singh

~ onex

Related Elements

2702
1
0

This sidebar contact form is used to get user query form the same page.

Sidebar contact form

onex

1692
1
0

Step by step form is smart way to collect data, where we collect data from user in steps.

Step by step bootstrap form

onex

1623
0
0

ionic 4 form example

onex

1533
0
0

Bootstrap 3 Modal

onex

Bootstrap Pop up login form

onex

This is an example of ionic 4 form , ionic is a Javascript framework used to build hybrid mobile app,desktop and pwa.

Ionic form example

onex

FORM VALIDATIONS

Bootstrap Registration form wi

bhuwan

This kind of registration and appointment booking form can be used on many places like on slider,banner and section.

Register Now Form

onex

4083
12
0

Grid service list with lighten

onex

<section style="padding:55px 0">
    <div class="container">
        <div class="row">
        <div class="col l12">
            <div class="card">
                <div class="card-content">
                    <nav class="teal"><a href="#" class="brand-logo center adp-logo">Simple Checkout</a></nav>
                    <h6 class="grey-text  darken-2">Enter Mandatory Details:</h6>
                    <div class="row" style="box-shadow: unset;">
                      <div class="col l4 m4 s12">
                        <img class="resp-img" src="https://digitaldoorlock.in/assets/images/doorlock.png">
                      </div>
                      <div class="col m8 l8 s12">
                          <div class="row">
                        <form class="col s12">
                         <div class="row">
                            <div class="input-field col s12">
                              <input id="name" type="text" class="validate">
                              <label for="name">Name</label>
                            </div>
                          </div>
                          <div class="row">
                            <div class="input-field col s12">
                              <input id="mobile" type="tel" class="validate">
                              <label for="mobile">Mobile</label>
                            </div>
                          </div>
                          <div class="row">
                            <div class="input-field col s12">
                              <input id="email" type="email" class="validate">
                              <label for="email">Email</label>
                            </div>
                          </div>
                          <div class="row">
                            <div class="input-field col s12">
                              <input id="quantity" type="number" class="validate" value="1" min="1">
                              <label for="quantity">Quantity</label>
                            </div>
                          </div>
                          <div class="adp-align">
                              <p class="name">Amount</p>
                              <p class="price"><i class="fas fa-rupee-sign"></i>&nbsp;<span id="price">2100</span>/-</p>
                          </div>
                          <div class="adp-align" style=margin-top:5rem;>
                              <button class="btn waves-effect waves-light right" type="submit" name="action">Pay Now</button>
                          </div>
                        </form>
                        <input type="hidden" class="initial_value" value="2100">
                      </div>
                        </div>
                        
                    </div>
                    
                </div>
            </div>
        </div>
    </div>
    </div>
</section>

Get HTML

Get CSS

Get JS

Checkout page with materialize

Abhishek Singh

Related Elements

Resourse

Log in