andruhovski icon

Form-demo

andruhovski | PRO | 12/17/16 10:16:23 AM UTC | 0 ⭐ | 618 👁️ | Never ⏰ | []
HTML |

3.52 KB

|

None

|

0 👍

/

0 👎

<!DOCTYPE html>
<html lang="ru">
 
<head>
    <title></title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
    <style>  
      #demo01 {
          visibility: hidden;
      }  
    </style>
<script>
    function display_alert() {
        demo01.style.visibility = "visible";
    }
</script>
</head>
 
<body>
 
    <div class="jumbotron">
        <div class="container">
            <h1>Hello, world!</h1>
            <a class="btn btn-primary btn-lg">Learn more</a>
            </p>
        </div>
    </div>
 
    <div class="container">
 
        <div class="row">
            <div class="col-md-9">
                <form class="form-horizontal" role="form">
                    <legend>Регистрация участника</legend>
 
                    <div class="form-group">
                        <label class="control-label col-md-3" for="greet1">Как в Вам обращаться?</label>
                        <div class="col-md-6">
                            <select class="form-control" id="greet1">
                            <option value="1">Mr</option>
                            <option value="2">Mrs</option>
                            <option value="3">Sensei</option>
                        </select>
                        </div>
                    </div>
 
                    <div class="form-group">
                        <label class="control-label col-md-3" for="first_last_name">Фамилия и имя</label>
                        <div class="col-md-6">
                            <input class="form-control" id="first_last_name" type="text" placeholder="Пушкин Александр" required/>
                        </div>
                    </div>
 
                    <div class="form-group">
                        <label class="control-label col-md-3" for="company">Компания (учнбное заведение)</label>
                        <div class="col-md-6">
                            <input class="form-control" id="company" type="text" placeholder="НафтоГаз" required/>
                        </div>
                    </div>
 
                    <div class="form-group">
                        <label class="control-label col-md-3" for="work_email">E-mail</label>
                        <div class="col-md-6">
                            <div class="input-group">
                                <div class="input-group-addon">
                                    <span class="glyphicon glyphicon-envelope"></span>
                                </div>
                                <input class="form-control" id="work_email" type="email" placeholder="[email protected]" required/>
                            </div>
                        </div>
                    </div>
 
                    <div class="form-group">
                        <label class="control-label col-md-3" for="job_position">Должность</label>
                        <div class="col-md-6">
                            <input class="form-control" id="job_position" type="text" placeholder="зам. директора" required/>
                        </div>
                    </div>
 
                    <div class="form-group">
                        <label class="control-label col-md-3" for="city">Город</label>
                        <div class="col-md-6">
                            <div class="input-group">
                                <div class="input-group-addon">
                                    <span class="glyphicon glyphicon-home"></span>
                                </div>
                                <input class="form-control" id="city" type="text" placeholder="г. Киев" required/>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="control-label col-md-3" for="feedback">
                        Как нам сделать конференцию интересней?</label>
                        <div class="col-md-6">
                            <textarea id="feedback" name="feedback" rows="10" cols="8" class="form-control"></textarea>
                        </div>
                    </div>
 
                    <button type="submit" class="btn btn-primary col-md-offset-6">Submit</button>
                </form>
 
            </div>
 
        </div>
 
    </div>
 
    <script src="/node_modules/jquery/dist/jquery.min.js"></script>
    <script src="/node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
</body>
 
</html>

Comments