title: How can Submit Button's OnClick Event invoke both Server-Side and Client-Side Code?
body: <p>I am using bootstrap template called Metronic. The asp:LinkButton below was simple button control. Just to be able to invoke the ServerSide event-handler (SubmitButton_Click), I converted it into asp:LinkButton control. But this time it doesn't invoke the javascript code. I tried OnClientClick. But didn't work.</p>
  
  <p>Login.aspx:</p>
  
  <pre><code> &lt;asp:LinkButton runat="server" ID="LinkButton1" CssClass="btn btn-default pull-right"
    onclick="SubmitButton_Click"&gt;Log In&lt;i class="m-icon-swapright m-icon-white"&gt;&lt;/i&gt;
   &lt;/asp:LinkButton&gt;
  
  &lt;script&gt;
      jQuery(document).ready(function () {
          App.init();
          Login.init();
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>Part of login.js:</p>
  
  <pre><code>var Login = function () {
  
  return {
      //main function to initiate the module
      init: function () {
  
         $('.login-form').validate({
              errorElement: 'label', //default input error message container
              errorClass: 'help-inline', // default input error message class
              focusInvalid: false, // do not focus the last invalid input
              rules: {
  ..
  ..
  }
  </code></pre>
  
  <p>Login.aspx.cs:</p>
  
  <pre><code>protected void SubmitButton_Click(object sender, EventArgs e)
  {
     ..
  }
  </code></pre>
  
  <p>Login.js:</p>
  
  <pre><code>var Login = function () {
  
  return {
      //main function to initiate the module
      init: function () {
  
         $('.login-form').validate({
              errorElement: 'label', //default input error message container
              errorClass: 'help-inline', // default input error message class
              focusInvalid: false, // do not focus the last invalid input
              rules: {
                  username: {
                      required: true
                  },
                  password: {
                      required: true
                  },
                  remember: {
                      required: false
                  }
              },
  
              messages: {
                  username: {
                      required: "Username is required."
                  },
                  password: {
                      required: "Password is required."
                  }
              },
  
              invalidHandler: function (event, validator) { //display error alert on form submit   
                  $('.alert-error', $('.login-form')).show();
              },
  
              highlight: function (element) { // hightlight error inputs
                  $(element)
                      .closest('.control-group').addClass('error'); // set error class to the control group
              },
  
              success: function (label) {
                  label.closest('.control-group').removeClass('error');
                  label.remove();
              },
  
              errorPlacement: function (error, element) {
                  error.addClass('help-small no-left-padding').insertAfter(element.closest('.input-icon'));
              },
  
              submitHandler: function (form) {
                  window.location.href = "/Default.aspx";
              }
          });
  
          $('.login-form input').keypress(function (e) {
              if (e.which == 13) {
                  if ($('.login-form').validate().form()) {
                      window.location.href = "index.html";
                  }
                  return false;
              }
          });
  
          $('.forget-form').validate({
              errorElement: 'label', //default input error message container
              errorClass: 'help-inline', // default input error message class
              focusInvalid: false, // do not focus the last invalid input
              ignore: "",
              rules: {
                  email: {
                      required: true,
                      email: true
                  }
              },
  
              messages: {
                  email: {
                      required: "Email is required."
                  }
              },
  
              invalidHandler: function (event, validator) { //display error alert on form submit   
  
              },
  
              highlight: function (element) { // hightlight error inputs
                  $(element)
                      .closest('.control-group').addClass('error'); // set error class to the control group
              },
  
              success: function (label) {
                  label.closest('.control-group').removeClass('error');
                  label.remove();
              },
  
              errorPlacement: function (error, element) {
                  error.addClass('help-small no-left-padding').insertAfter(element.closest('.input-icon'));
              },
  
              submitHandler: function (form) {
                  window.location.href = "index.html";
              }
          });
  
          $('.forget-form input').keypress(function (e) {
              if (e.which == 13) {
                  if ($('.forget-form').validate().form()) {
                      window.location.href = "index.html";
                  }
                  return false;
              }
          });
  
          jQuery('#forget-password').click(function () {
              jQuery('.login-form').hide();
              jQuery('.forget-form').show();
          });
  
          jQuery('#back-btn').click(function () {
              jQuery('.login-form').show();
              jQuery('.forget-form').hide();
          });
  
          $('.register-form').validate({
              errorElement: 'label', //default input error message container
              errorClass: 'help-inline', // default input error message class
              focusInvalid: false, // do not focus the last invalid input
              ignore: "",
              rules: {
                  username: {
                      required: true
                  },
                  password: {
                      required: true
                  },
                  rpassword: {
                      equalTo: "#register_password"
                  },
                  email: {
                      required: true,
                      email: true
                  },
                  tnc: {
                      required: true
                  }
              },
  
              messages: { // custom messages for radio buttons and checkboxes
                  tnc: {
                      required: "Please accept TNC first."
                  }
              },
  
              invalidHandler: function (event, validator) { //display error alert on form submit   
  
              },
  
              highlight: function (element) { // hightlight error inputs
                  $(element)
                      .closest('.control-group').addClass('error'); // set error class to the control group
              },
  
              success: function (label) {
                  label.closest('.control-group').removeClass('error');
                  label.remove();
              },
  
              errorPlacement: function (error, element) {
                  if (element.attr("name") == "tnc") { // insert checkbox errors after the container                  
                      error.addClass('help-small no-left-padding').insertAfter($('#register_tnc_error'));
                  } else {
                      error.addClass('help-small no-left-padding').insertAfter(element.closest('.input-icon'));
                  }
              },
  
              submitHandler: function (form) {
                  window.location.href = "index.html";
              }
          });
  
          jQuery('#register-btn').click(function () {
              jQuery('.login-form').hide();
              jQuery('.register-form').show();
          });
  
          jQuery('#register-back-btn').click(function () {
              jQuery('.login-form').show();
              jQuery('.register-form').hide();
          });
      }
  
  };
  
  }();
  </code></pre>