jquery validation along with update panel .. Why its refreshing whole page

Question

Im using asp.net 4.0 webforms with jquery validation(bootstrap validator) and update panel(which adds a new dynamic user control). When I add a new dynamic user control the jquery validation is working just fine as expectd. But the problem is, the page is loaded(full posted back instead of async postback). PLease help me.... here is my JS and html for update panel

  <script type="text/javascript">
      function pageLoad() {
          $('#form1').bootstrapValidator({
              message: 'This value is not valid',
              feedbackIcons: {
                  valid: 'glyphicon glyphicon-ok',
                  invalid: 'glyphicon glyphicon-remove',
                  validating: 'glyphicon glyphicon-refresh'
              }
          });
          Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest(onEachRequest);

      }
      function onEachRequest(sender, args) {
          //var isValid = $("form").validate().form();
          args.set_cancel(true);
      }
      </script>

  <asp:UpdatePanel ID="upgpForm" runat="server">
      <ContentTemplate>
        <script type="text/javascript" language="javascript">
           Sys.Application.add_load(pageLoad);
        </script>
     <div class="row pull-right">
       <asp:Button Text="Add New Series" CssClass="btn btn-primary" ID="btnAddSeries"           runat="server" OnClick="btnAddSeries_Click" />
     </div>

      <asp:PlaceHolder runat="server" ID="phSeries"></asp:PlaceHolder>
  </ContentTemplate>
  </asp:UpdatePanel>

I apprecitae your suggestions in this issue...