<div class="ui center aligned container" style="margin-top: 90px">
        <form class="ui fluid inverted segment form">

            <div class="ui stacked inverted segment">
                <div class="field">
                    <div class="ui left icon input">
                        <i class="user icon"></i>
                        <input type="text" name="name" placeholder="Name">
                    </div>
                </div>

                <div class="field">
                    <div class="ui left icon input">
                        <i class="mail icon"></i>
                        <input type="text" name="email" placeholder="Email">
                    </div>
                </div>

                <div class="field">
                    <div class="ui left icon input">
                        <i class="history icon"></i>
                        <input type="text" name="expiry" placeholder="Expiry">
                    </div>
                </div>

                <div class="ui fluid floating dropdown labeled search icon button" name="host">
                    <i class="caret down icon"></i>
                    <span class="center aligned text">Choose Host</span>
                    <div class="menu">
                        <div class="item">host1</div>
                        <div class="item">host2</div>
                        <div class="item">host3</div>
                        <div class="item">host4</div>
                    </div>
                </div>

                <div class="ui fluid large teal submit big button" style="margin-top: 50px">Submit</div>

            </div>

            <div class="ui error message"></div>
            <div class="ui success message"></div>
        </form>

    </div>

    <script>
        $('.ui.dropdown').dropdown();

        var formValidationRules = {
            fields: {
                name: {
                    identifier  : 'name',
                    rules: [
                        {
                            type   : 'empty',
                            prompt : 'Please enter your name'
                        }
                    ]
                },

                email: {
                    identifier  : 'email',
                    rules: [
                        {
                            type   : 'empty',
                            prompt : 'Please enter your email'
                        },
                        {
                            type   : 'email',
                            prompt : 'Please enter a valid email'
                        }
                    ]
                },
                expiry: {
                    identifier  : 'expiry',
                    rules: [
                        {
                            type   : 'empty',
                            prompt : 'Please enter expiry'
                        },
                        {
                            type   : 'integer[1..24]',
                            prompt : 'Expiry should be between 1 and 24'
                        }
                    ]
                }
            }
        };

        var formSettings = {
            on: 'blur',
            inline: true,
            onSuccess : function() {
                alert("success");
                return true;
            }
        };

        $(document).ready(function() {
              $('.ui.form').form(formValidationRules, formSettings);
        });
    </script>