2nd button not triggering Validate

2nd button not triggering Validate

Re-posting this question as I mistakenly checked "answered".

Inherited an ASPX webform project (yeah ):
  • Master has a
    <asp:button id="btn1" runat="server" Text="btn1" PostBackUrl="page1.aspx"></asp>
  • Content page2.aspx has
    <asp:button id="btn2" runat="server" Text="btn2" PostBackUrl="page2.aspx"></asp>

When <input> fields are empty, they are expected to be invalid.
  1. click on btn1, validate kicks in, confirmed by F12, they are invalid, good.
  2. click on btn2, validate won't kick in, confirmed by F12.
  3. if manually inserted .validate() into the client click function of btn2, it ran but empty fields are valid.
  4. if manually inserted .validate().element("#Field2") like No. 3, it tells me Field2 is required, expected.

F12 shows HTML of page2 as:
  1. <html>
  2. <body>
  3.   <div id="MasterMain">
  4.     <form name="aspnetForm" id="aspnetForm" action="page2.aspx" method="post">
  5.     ... <table><tr><td><input name="Field1" id="Field1" class="required" type="text"/>
  6.           <input name="ct100$btn1" id="ct100_btn1" onclick="btn1ClientClick();WebForm_DoPostBackWithOptions("ct100$btn1", ..., "page1.aspx", ...)" type="submit" />
  7.     ...</td></tr></table>
  8.     ...<div><input name="Field2" id="Field2" class="required" type="text"/>
  9.          <input name="ct100$Mainbtn2" id="ct100_Mainbtn2" onclick="btn2ClientClick();WebForm_DoPostBackWithOptions("ct100$Mainbtn2", ..., "page2.aspx", ...)" />

F12 shows Script of page2 as:
  1. $(document).ready(function() {
  2.  var validator = $("#aspnetForm").validate({
  3.     invalidHandler: function(e, validator){
  4.     // something
  5.     },
  6.     debug: false
  7. });

Analyzing code above, only diff is btn1 has type="submit". Is it the key?

My understanding is both buttons should trigger the same .validate() block registered in .ready().