Geek Answers Handbook

Parsley 2.0.3 does not work with hopper 3

I am trying to use parsely.js in my html page to check an input field. this html page currently contains one input field and one submit button. the structure is created using bootstrap 3, and this page does not contain the Form tag .

<div role='form'>
    <div class="row form-group">
        <div class="col-xs-3">
            <label title="fullname">Full Name</label>
        </div>
        <div class="col-xs-4">
            <input type="text" class='form-control' id="name" name="fullName" data-parsley-required="true" data-parsley-required-message="Please insert your name"/>
        </div>
    </div>

  <input type="submit"  class= "btn btn-danger"/> </div>

I call parsley.js as

function validateInput()
        {

        var handle = $("input[name='fullName']").parsley({
            successClass: "has-success",
            errorClass: "has-error",
            classHandler: function (el) {
              return $(el).closest('.form-group');//not working

            },
            errorsWrapper: "<span class='help-block'></span>",
            errorTemplate: "<span></span>",

        });

        return handle.isValid();
    }

when you click the submit button. it returns true / false correctly and also creates a span tag. but error classes do not apply. even data-parsley-required-message 'Please insert your name' does not work.

($ (el)) alert (el), [object Object]. , el , . el.attr('id') . undefined.

//return el.closest('.form-group');//not working
//return el.$element.closest('.form-group)//not working
//return $(el).$element.closest('.form-group')//not working

Form, html - sharepoint.

0
1

:

  • Parsley , (. );

  • classHandler ParsleyField. el.$element (: alert(el.$element.attr('id'));

validateInput:

<script type="text/javascript">
    function validateInput() {
        $("input[name='fullName']").parsley({
            successClass: "has-success",
            errorClass: "has-error",
            classHandler: function (el) {
                return el.$element.closest('.form-group'); //working
            },
            errorsWrapper: "<span class='help-block'></span>",
            errorTemplate: "<span></span>",
        });

        // Returns true / false if the field has been validated. Does not affect UI.
        //$("input[name='fullName']").parsley().isValid());

        // validate field and affects UI
        $("input[name='fullName']").parsley().validate();
    }
</script>

, successClass errorClass div form-group.

. jsfiddle

+3

More articles:


All Articles