Terry Gilliver
Posts: 0
Joined: Fri Apr 18, 2014 8:45 pm

jQuery validator plugin

Has anyone used the jQuery validator plugin with appery? Any pointers would be appreciated.

Evgene Karachevtsev
Posts: 12
Joined: Mon Apr 28, 2014 1:12 pm

jQuery validator plugin

Hello Terry,

Could you please tell us, are you talking about this (http://jqueryvalidation.org/) plugin? It can be added via create new/ javascript

Terry Gilliver
Posts: 0
Joined: Fri Apr 18, 2014 8:45 pm

jQuery validator plugin

Yes, that is the one. I have added a new javascript containing the contents of

/*! jQuery Validation Plugin - v1.13.0 - 7/1/2014

  • http://jqueryvalidation.org/

  • Copyright (c) 2014 Jörn Zaefferer; Licensed MIT */

    How do I incorporate the validation code into my form?

    This is what I think. Since I do not have direct access to the html without editing the source and breaking the visual editor, then I need to code in jquery, yes?

    I looked at sample code for the validator and it appears that it works on the form tag e.g.

    pre
    <form id="signupForm" method="get" action="">
    <fieldset>
    <legend>Validating a complete form</legend>
    <p>
    <label for="firstname">Firstname</label>
    <input id="firstname" name="firstname" type="text">
    </p>
    <p>
    <input class="submit" type="submit" value="Submit">
    </p>
    </fieldset>
    </form>
    /pre

    and the relevant js is:
    pre
    $("#signupForm")&#46;validate({
    rules: {
    firstname: "required"
    },
    messages: {
    firstname: "Please enter your firstname"
    }
    });
    /pre

    I looked in the source generated by appery and there are no form tags, so how do I implement this?

Evgene Karachevtsev
Posts: 12
Joined: Mon Apr 28, 2014 1:12 pm

jQuery validator plugin

Hello Terry,

Could you please provide us with information, do you have any errors in the console? You are using an outdated method of adding rules, could you please try as it is shown here: http://stackoverflow.com/questions/18...

Terry Gilliver
Posts: 0
Joined: Fri Apr 18, 2014 8:45 pm

jQuery validator plugin

You misunderstand, i don't have any errors as I don't know how to implement the code. In the example you gave, the code is based on a form with an Id of MyForm
In the generated appery html there are no <form> tags
pre
<form action="#" id="MyForm" name="MyForm">
<table id="tblData">
<tr>
<td>
<label>
Field1</label>
<input id="Field1" name="Field1" type="text" value="" />
</td>
</tr>
<tr>
<td>
<label>
Field2</label>
<input id="Field2" name="Field2" />
</td>
</tr>
<tr>
<td>
<span id="submitButton" class="k-button">Next</span>
<input type="submit" class="button" name="submitButtonTest" id="submitButtonTest"
value="Validation Test">
</td>
</tr>
</table>
</form>
/pre

Evgene Karachevtsev
Posts: 12
Joined: Mon Apr 28, 2014 1:12 pm

jQuery validator plugin

Terry,

Appery.io does not add a tag form. You can add this html markup using component html

Terry Gilliver
Posts: 0
Joined: Fri Apr 18, 2014 8:45 pm

jQuery validator plugin

I tried playing around with this.

There are a couple of issues:
1) the html component is encapsulated in a <div>
2) I think that the plugin may work only after a form submit, which appery doesn't do.

I think I'll have to give up on this plug in and hard code my own validation.

What I need to do in particular is to make sure that an input field of type date is not left blank when I submit the form data to the database.

Can you suggest a simple way to do this?

Evgene Karachevtsev
Posts: 12
Joined: Mon Apr 28, 2014 1:12 pm

jQuery validator plugin

Terry,

You should check the value of the field by clicking the button. And if it is empty, then give a warning and do not perform further actions hung on click event. For this you can cause
prereturn;/pre
after issuing warning.

Terry Gilliver
Posts: 0
Joined: Fri Apr 18, 2014 8:45 pm

jQuery validator plugin

Sorted, Thanks

Jack Bua
Posts: 0
Joined: Sun Jun 28, 2015 10:16 pm

jQuery validator plugin

I created Javascript from file and uploaded jquery.validate.js JS Script file. In the editor, I noticed a warning.

Image

Should I ignore this or change this?

Return to “Issues”