I'm using Ajax and jQuery on a asp.net 4.0 web site.
I have this code on a webform (which has a masterpage):

 $(document).ready(function () {
          $("#ctl00_ContentPlaceHolder1_btnInvocar").click(function (event) {
                  type: "POST",
                  url: "ServiciosWeb.asmx/ObtenModulos",
                  data: "{}",
                  contentType: "application/json; charset=utf-8",
                  dataType: "json",
                  success: function (result) {
                  error: AjaxFailed

      function LLenaGrid(result) {
          var table = "<table>"+
          var row = "";
          var i = 0;
          $.each(result, function (key) {
              row += "<tr>";
              for (i = 0; i < result[key].length; i++) {
                  row += "<td>" + result[key][i] + "</td>"; ;
              row += "</tr>";
          table += row;
          table += '</tbody></table>';
It does get me what I want inside var table, it even shows the div with the table after I click, but suddenly the result disappears!! and i get the normal page again as though i didn't click the button.
it's like it were doing a postback but why? it's supposed to work that way

any suggestions?
thanks in advance