El siguiente codigo hace que mi elemento nuevo se inserte despues del elemento input:
.validate({ errorPlacement: function (error, element) { element.after(error); },
Es decir, tengo este codigo HTML:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
<fieldset class="form-group">
<input type="email" class="form-control" id="email-label" placeholder="" />
<label for="email-label">Your Email</label>
</fieldset>
<style>
body {
margin: 50px;
}
fieldset.form-group {
position: relative;
}
label {
position: absolute;
top: .6rem;
left: 1rem;
transition: all .4s linear;
}
:focus+label {
color: #800040;
top: -15px;
background: #F2F2F2;
}
</style>
Si ese campo lo dejo vacio, se me agrega un label despues del input:
<label id="confirm-error" class="error" for="confirm">Este campo es requerido.</label>
Quedando el codigo de la siguiente manera:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
<fieldset class="form-group">
<input type="email" class="form-control" id="email-label" placeholder="" />
<label id="confirm-error" class="error" for="confirm" style="color:red">Este campo es requerido.</label>
<label for="email-label">Your Email</label>
</fieldset>
<style>
body {
margin: 50px;
}
fieldset.form-group {
position: relative;
}
label {
position: absolute;
top: .6rem;
left: 1rem;
transition: all .4s linear;
}
:focus+label {
color: #800040;
top: -15px;
background: #F2F2F2;
}
</style>
Y lo que quiero es que quede debajo, asi:
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet" />
<fieldset class="form-group">
<input type="email" class="form-control" id="email-label" placeholder="" />
<label for="email-label">Your Email</label>
</fieldset>
<label id="confirm-error" class="error" for="confirm" style="color:red; padding-top:80px; padding-left:30px">Este campo es requerido.</label>
<style>
body {
margin: 50px;
}
fieldset.form-group {
position: relative;
}
label {
position: absolute;
top: .6rem;
left: 1rem;
transition: all .4s linear;
}
:focus+label {
color: #800040;
top: -15px;
background: #F2F2F2;
}
</style>
Entonces como digo en el primer codigo que adjunte que enlugar de que sea despues del Input, sea despues del Form-Group, es decir despues de </fieldset>