Kendo validation not working - validation

Question

Hi I've a page with two textboxes and I wanted to apply required validator to both controls. But when I run my code it is applying to only first control. Even though I've given both text boxes as blank, it is showing first text box as required.
Here is my code and not getting where do I missed the second one.
<input type="text" name="firstname" id="firstname" required validationmessage="First name required" />
<input type="text" name="lastname" id="lastname" required validationmessage="Last name required" />
<button class="k-button" id="btnAdd" onclick="addDetails();">Add</button>
function addDetails() {
var validator = $("#btnAdd").kendoValidator().data("kendoValidator");
if (validator.validate()) {
// Add details to db
}
}

Answer 1

Kendo Validator has to be applied to the input that you are validating not to the button. The HTML should be something like:
<div id="my-form">
<div>
<label>
Firstname:
<input type="text" name="firstname" id="firstname" required validationmessage="First name required"/>
</label>
</div>
<div>
<label>
Lastname :
<input type="text" name="lastname" id="lastname" required validationmessage="Last name required"/>
</label>
</div>
</div>
<button class="k-button" id="btnAdd">Add</button>
And the validation function:
$(document).ready(function () {
var validator = $("#my-form").kendoValidator().data("kendoValidator");
$("#btnAdd").on("click", function () {
if (validator.validate()) {
// Add details to db
console.log("good");
} else {
console.log("bad");
}
});
});