Insert after a Form-Group

Navigation
1

The following code causes my new element to be inserted after the input element: 

.validate({ errorPlacement: function (error, element) { element.after(error); },

I mean, I have this HTML code: 

<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>

If that field is left empty, a label is added after the input:

<label id="confirm-error" class="error" for="confirm">Este campo es requerido.</label>

The code remains as follows: 

<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>

And what I want is to be below, like this: 

<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>

Then as I say in the first code that you attach that after the Input, after the Form-Group, that is after </fieldset>

    
asked by afar1793 20.09.2017 в 18:15
source

1 answer

0

You can try searching the parent tag of the input: 

.validate({ errorPlacement: function (error, element) {
    element.parent().after(error);
}, ...
    
answered by 20.09.2017 в 18:34
Send array, POST method Send value via post php ajax [closed]