parsleyjs validation : Change the position of parsley-errors-list in parsleyjs

You can set the error container with (at least) two ways.

1. Change the container with DOM attributes
   In cases where you only have one input (or group of inputs, like you do) and you want to change the container of the errors on those inputs, you can use data-parsley-errors-container="#element" (see the docs). Here is an example (jsfiddle demo)

   <fieldset>
       <label class="checkbox-inline">
           <input type="checkbox" id="inlineCheckbox1" required data-parsley-maxcheck="2" data-parsley-multiple="checkbox2" value="option1" data-parsley-errors-container="#checkbox-errors" /> 1
       </label>
       <label class="checkbox-inline">
           <input type="checkbox" id="inlineCheckbox2" data-parsley-maxcheck="2" data-parsley-multiple="checkbox2" value="option2" /> 2
       </label>
       <label class="checkbox-inline">
           <input type="checkbox" id="inlineCheckbox3" data-parsley-maxcheck="2" data-parsley-multiple="checkbox2" value="option3" /> 3
       </label>
   
       <div id="checkbox-errors"></div>
   </fieldset>

   Note the attribute data-parsley-errors-container="#checkbox-errors" on the first checkbox and the element <div id="checkbox-errors"></div> at the end of the fieldset.
   In this case you don't need to add the data-parsley-errors-container to all checkboxes because you're "grouping" them with data-parsley-multiple="checkbox2".
2. Set a custom configuration to be used by Parsley
   In cases where you have a few or all inputs and you want to change the position of the default container. Lets say all your fields are placed inside a fieldset and you want to display the errors at the end of the fieldset.
   This solution allows you to change the default container for each field (jsfiddle demo)

   <fieldset>
       <label class="checkbox-inline">
           <input type="checkbox" id="inlineCheckbox1" required data-parsley-maxcheck="2" data-parsley-multiple="checkbox2" value="option1" /> 1
       </label>
       <label class="checkbox-inline">
           <input type="checkbox" id="inlineCheckbox2" data-parsley-maxcheck="2" data-parsley-multiple="checkbox2" value="option2" /> 2
       </label>
       <label class="checkbox-inline">
           <input type="checkbox" id="inlineCheckbox3" data-parsley-maxcheck="2" data-parsley-multiple="checkbox2" value="option3" /> 3
       </label>
   
       <div id="checkbox-errors"></div>
   </fieldset>
   
   <script>
   $(document).ready(function() {
       var parsleyConfig = {
           errorsContainer: function(parsleyField) {
               var fieldSet = parsleyField.$element.closest('fieldset');
   
               if (fieldSet.length > 0) {
                   return fieldSet.find('#checkbox-errors');
               }
   
               return parsleyField;
           }
       };
   
   
       $("form").parsley(parsleyConfig);
   });
   </script>

   In this solution we've added the element <div id="checkbox-errors"></div> before the end of the fieldset and changed the errorsContainer option of Parsley. If our element is inside a fieldset the errors will be displayed inside the #checkbox-errors.
   Based on this example, you are also able to set the same container for all fields. In this case your options would be something like this (jsfiddle demo):

   var parsleyConfig = {
       errorsContainer: function(parsleyField) {
           return $('#errors');
       }
   };

https://stackoverflow.com/questions/30122028/change-the-position-of-parsley-errors-list-in-parsleyjs