CODEWITHSUNDEEP
htmlvalidationparsley.js
ambe5950
ambe5950

Reputation: 75

parsley.js hidden input file not validating

So I have a google map where the user selects their location, and I am trying to validate that they have selected a location, by populating a hidden input field. I was able to get it to work with a different validation engine, but now need it to work with parsley.

If the user has not selected a location, I need it to display the error message, as with all other validations. All my other validations are working, so I suspect it is something with my syntax. I am a bit confused by the parsley documentation as far as hidden input fields.

Here is my html: 

<div class="col-md-6">
    <!-- WIDGET GOOGLE MAP -->
    <div class="widget">
        <div class="widget-header" style="height: 115px;">
            <h3><i class="fa fa-globe"></i> Part II:    Click & drag to select your location <small>(Your actual location will never be stored or shared. It will always be randomized within a five (5) mile radius when shown to other users)</small></h3>
            <em>- custom styled google map</em>
        </div>
        <div class="widget-content no-padding" style="height: 300px;" >
            <div class="google-map">
                <div id="register-map-canvas" style="height: 300px;"></div>
            </div>

        </div>
        <div class="widget-content">
             <div class="form-group">  
                <input type="hidden" name="homelat" id="latFld" required data-parsley-errors-container="#error-map"/>    <!--the homelat input field is below the map only because it looks silly with two adjacent error messages-->  
            </div>
            <div class="form-group">                
                <input type="hidden" name="homelng" id="lngFld" /> 
            </div>
            <p id="error-map"></p>
            <button class="btn btn-primary btn-block" type="submit">Register</button>
                                                                    <button type="submit" class="btn btn-primary">Validate</button>


        </div>

    </div>
    <!-- END WIDGET GOOGLE MAP -->
</div>

So as you can see, I am trying to get the error message to pop up beneath my map within a widget box.

I populate the latFld and lngFld inputs but only validate one of them, so as to only generate one error message. But unfortunately I cannot get that one to validate. I know the fields are populating.

Upvotes: 0

Views: 1107

Answers (1)

Patrick Ducret
Patrick Ducret

Reputation: 21

In the js parsley file (~line 195) you must on excluded: line put in comment or delete input[type=hidden]'

var ParsleyDefaults = {
    // ### General
    // Default data-namespace for DOM API
    namespace: 'prsly-',
    // Supported inputs by default
    inputs: 'input, textarea, select',
    // Excluded inputs by default
    excluded: 'input[type=button], input[type=submit], input[type=reset]', 
    //input[type=hidden]',

Upvotes: 1

Related Questions