[SOLVED] Validation in Dojo Form

Validation in Dojo Form

I have a dojo form in which 5 fields are there: 2 of them are validationtext box, 1 is filteringSelect and 2 are NumberText Box. On click of search button, I want user to enter atleast one value out of 5 fields. How can I apply this validation ?

Thanks

Solution

You need to use dijit/form/Form http://dojotoolkit.org/reference-guide/1.10/dijit/form/Form.html#dijit-form-form

require(["dojo/parser", "dijit/form/Form", "dijit/form/Button", "dijit/form/ValidationTextBox", "dijit/form/DateTextBox"], function(parser) {
    document.body.className += ' tundra'; //just to have the proper css  in the snippet
  
  
    parser.parse() //to render properly in the snippets
    
    
    //here is the part you are looking for:
    getValues = function() {
      console.log(myForm.getValues());
      values = myForm.getValues();
      var oneHasValue = false;
      for(var i in values) {
         if(values[i]) {
           oneHasValue = true;
           break;
         }
      }
      if(!oneHasValue) {
         alert('at least one field should not be empty')  
      }
    }
    
});

<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script>
<link rel="stylesheet" type="text/css" href="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/resources/dojo.css"> 
<link rel="stylesheet" type="text/css" href="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/tundra/tundra.css">

<div data-dojo-type="dijit/form/Form" id="myForm" data-dojo-id="myForm"
encType="multipart/form-data" action="" method="">
    
    <table style="border: 1px solid #9f9f9f;" cellspacing="10">
        <tr>
            <td>
                <label for="name">Name:</label>
            </td>
            <td>
                <input type="text" id="name" name="name" required="true" data-dojo-type="dijit/form/ValidationTextBox"/>
            </td>
        </tr>
        <tr>
            <td>
                <label for="gender">gender:</label>
            </td>
            <td>
                <input type="text" id="gender" name="gender" required="true" data-dojo-type="dijit/form/ValidationTextBox"/>
            </td>
        </tr>
        <tr>
            <td>
                <label for="extra">extra info:</label>
            </td>
            <td>
                <input type="text" id="extra" name="extra" required="true" data-dojo-type="dijit/form/ValidationTextBox"/>
            </td>
        </tr>
        <tr>
            <td>
                <label for="dob">Date of birth:</label>
            </td>
            <td>
                <input type="text" id="dob" name="dob" data-dojo-type="dijit/form/DateTextBox"/>
            </td>
        </tr>
    </table>

    <button data-dojo-type="dijit/form/Button" type="button" onClick="getValues()">Get Values from form!</button>

</div>