data in alert box using javascript

Question

I try to populate data in alert box on button click but when I click on button then alert box not populate

I try this

<head runat="server">
  <title></title>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

</head>

<body>
  <form id="form1" runat="server">
    <div>
      <button id="submitchart" runat="server">Show Chart</button>
    </div>
  </form>
</body>
<script type="text/javascript">
  $('#submitchart').click(function() {
    //alert("i");        
    $.ajax({
      type: 'POST',
      //url: 'WebForm1.aspx / Jqufunc',
      //data: JSON.stringify({ yearP: $('#yearValue').val() }),
      //data:{},
      contentType: 'application/json;charset=utf-8',
      dataType: 'json',
      success: function() {
        //alert(JSON.stringify(response.d));
        alert("i");
      }

    });
  });
  //});
</script>

when I write alert("i") after this line $('#submitchart').click(function () { then alert box populate but when i write alert ("i") after the success: function() { then alert box not populate

any solution?

that means the ajax is not a success add error function so you will. check the dev tools in XHR for ajax response..check console for error — guradio
– guradio, Commented Jun 1, 2016 at 6:42

zhangyx007 · Accepted Answer · 2016-06-01 07:13:02Z

1

  $(function () {
            $("#submitchart").on("click", function () {
                debugger;
                alert("i");
                $.ajax({
                    type: 'POST',
                    //url: 'WebForm1.aspx / Jqufunc',
                    //data: JSON.stringify({ yearP: $('#yearValue').val() }),
                    //data:{},
                    contentType: 'application/json;charset=utf-8',
                    dataType: 'json',
                    success: function () {
                        //alert(JSON.stringify(response.d));
                        debugger;
                        alert("i");
                    },
                    error: function () {
                        debugger;
                        alert("i");
                    }

                });

ajax will be run error,don't run success

answered Jun 1, 2016 at 7:13

zhangyx007

356 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

SUPER_USER Over a year ago

why we write debugger?

Kaja Mydeen · Accepted Answer · 2016-06-01 08:20:04Z

0

Give button type as button.

<head runat="server">
      <title></title>
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

    </head>

    <body>
      <form id="form1" runat="server">
        <div>
          <button id="submitchart" type="button" runat="server">Show Chart</button>
        </div>
      </form>
    </body>
    <script type="text/javascript">
      $('#submitchart').click(function() {
        //alert("i");        
        $.ajax({
          type: 'POST',
          url: 'WebForm1.aspx / Jqufunc',
          data: JSON.stringify({ yearP: $('#yearValue').val() }),
          //data:{},
          contentType: 'application/json;charset=utf-8',
          dataType: 'json',
          success: function() {
            //alert(JSON.stringify(response.d));
            alert("i");
          }

        });
      });
      //});
    </script>

This one worked for me.

answered Jun 1, 2016 at 8:20

Kaja Mydeen

5751 gold badge7 silver badges13 bronze badges

3 Comments

SUPER_USER Over a year ago

check this my another question .. stackoverflow.com/questions/37563080/…

SUPER_USER Over a year ago

i use function but still alert box not display

Kaja Mydeen Over a year ago

the problem is button type. by default button will work as submit button. if you click submit what ll happen. it will reload to given url. if url is not there then reload with in same page.

Gaurav Aggarwal · Accepted Answer · 2016-06-01 08:28:18Z

This happening because when you write alert("i") after $('#submitchart').click(function () { then its not dependent on success of any ajax call and ot works fine as it should but when you write this after success: function() { then it is dependent on ajax call and if there is some errors in ajax it will not run as you have only defined it for successful ajax.

Write this if ajax contains errors also

$('#submitchart').click(function() {
    //alert("i");        
    $.ajax({
      type: 'POST',
      //url: 'WebForm1.aspx / Jqufunc',
      //data: JSON.stringify({ yearP: $('#yearValue').val() }),
      //data:{},
      contentType: 'application/json;charset=utf-8',
      dataType: 'json',
      success: function() {
        //alert(JSON.stringify(response.d));
        alert("i");
      },
      error: function() {
        //alert(JSON.stringify(response.d));
        alert("i");
      }

    });
  });

Collectives™ on Stack Overflow

data in alert box using javascript

3 Answers 3

1 Comment

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related