Forum | Appery.io

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

Hello Terry,

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

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?

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

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

Terry,

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

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?

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.

Sorted, Thanks

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

Should I ignore this or change this?