@(myForm: Form[controllers.spaceInviteData], space: ProjectSpace, roleList: List[String], invite:List[SpaceInvite])(implicit  flash: play.api.mvc.Flash, user: Option[models.User])
    @import helper._
    @import play.api.i18n.Messages
    <div class="container row">
        <div class="col-md-8">

            <div class="tab-header">
                <h3>Invite new users</h3>
            </div>

            @form(action = routes.Spaces.inviteToSpace(space.id), 'id -> "invitecreate", 'enctype -> "multipart/form-data", 'class -> "form-horizontal", 'autocomplete -> "off", 'method -> "POST") {
                <fieldset class="email-new-users">
                    @inputText(myForm("addressList"),'class->"form-control", 'id -> "addressList", '_label -> "Email addresses (comma-separated)", 'type -> "Email", 'multiple -> "true")
                    <span class="error hiddencomplete" id="addresserror"> Please enter at least one email address.<br></span>

                    @select(myForm("role"), options(roleList), 'id -> "role_list", '_label -> "Role", 'placeholder -> "Select a default role for all recipients")
                    @textarea(myForm("message"), 'class->"form-control", '_label -> "Message")


                </fieldset>
                <div type="hidden" class="form-actions">
                    <button class="btn btn-primary" id="submitbutton"><span class="glyphicon glyphicon-envelope"></span> Send</button>
                </div>
            }
            <button class="btn btn-primary" id="invitebutton"><span class="glyphicon glyphicon-envelope"></span> Send</button>

        </div>
        <div class="col-md-4">

            <br />
            <h3>Invitations to @Messages("space.title") @space.name</h3>
            @for(v <- invite){
                <li>
                    @v.email as @v.role
                </li>
            }
        </div>
    </div>
    <script src="@routes.Assets.at("javascripts/chosen.jquery.js")" type="text/javascript"></script>
    <script language="javascript">

$('#submitbutton').hide();

$('#invitebutton').click(function() {
    $('#addresserror').hide();
    if(!$('#addressList').val()){
        $('#addresserror').show();
        console.log("no email");
    }else{


    var addrList = $('#addressList').val().split(',');
    for(var i = 0; i < addrList.length; i++){
        $('form fieldset').append('<input type="hidden" name="addresses['+i+']" value='+addrList[i]+' />');
    }
   $('#submitbutton').trigger("click" );
    }
});



</script>

    <style type="text/css">
    textarea {
    width: 100%;
    height: 100px;
    }
    input#addressList{
    width: 100%
    }
    </style>