Promact/slack-erp-custom-integration-mvc

<div class="group-edit">
    <div class="page-title">
        <div class="title_left">
            <h3>Add Group</h3>
        </div>
        <div class="title_right">
            <div class="form-group pull-right ">
                <button class="btn btn-success" (click)="backToGroupList()"><i class="fa fa-arrow-left"></i>Back</button>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-12 col-sm-12 col-xs-12">
            <div class="x_panel">
                <div class="x_content">

                    <form #groupForm="ngForm">
                        <div class="form-group">
                            <div class="row">
                                <label class="col-md-1">Name:</label>
                                <div class="col-md-3">
                                  
                                    <input type="text" class="form-control" [(ngModel)]="groupModel.Name" name="groupName" #groupName="ngModel" (blur)="checkGroupName(groupModel.Name)" required>
                                    <p [hidden]="!(groupName.touched && !groupName.valid && groupName.errors.required)" class="error">Name is required</p>
                                    <p [hidden]="!(isExistsGroupName)" class="error">Group name already exists</p>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="row">
                                <label class="col-md-1 emails">Emails:</label>
                                <div class="col-md-10">
                                    <md2-chips [(ngModel)]="groupModel.Emails"
                                               [isRemovable]="true"
                                               [readonly]="false"
                                               placeholder="Email"
                                               name="emails"
                                               #emails="ngModel"
                                               [allowedPattern]="validPattern"
                                               [isAutoComplete]="true"
                                               [autocompleteDataList]="listOfActiveEmail"
                                               required>
                                    </md2-chips>
                                    <p [hidden]="!(emails.touched && !emails.valid && emails.errors.required)" class="error">Atleast one email is required</p>
                                    </div>
                                </div>
                        </div>


                        <div>
                            <button class="btn-success btn update-btn" (click)="addGroup(groupModel)" [disabled]="!(groupForm.form.valid && !isExistsGroupName)">Submit</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>