Uncaught Exception in my jquery script

Question

Uncaught Exception in my jquery script

This is my code, am getting some error,
Error: uncaught exception: [Exception... "prompt aborted by user" nsresult: "0x80040111 (NS_ERROR_NOT_AVAILABLE)" location: "JS frame :: resource://gre/components/nsPrompter.js :: openTabPrompt :: line 468" data: no]

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="loginform.aspx.cs" Inherits="loginform" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title>Untitled Page</title>
  <script src="js/jquery-1.6.js" type="text/javascript"></script>
   <script type="text/javascript">   
   $(document).ready(function(){
     $("#btnsubmit").click(function(){      
        $.ajax({    
          type: "POST",            
           url: "loginform.aspx/getdataval",
           data:"{'uname':'"+$("#TextBox1").val()+"','passwod':'"+$("#TextBox2").val()+"'}",           
           contentType: "application/json;charset=utf-8",   
           dataType: "json",         
           success: function(msg) {
           alert("welcome");
           AjaxSucceeded(msg);
           },
              error: AjaxFailed
      })
   });
});
           function AjaxSucceeded(result) {
              alert(result.d);
              var Emp=result.d;
             $("#output").append('<p>'+Emp.Sname+ ' ' + Emp.Sno+'</p>');
           }
           function AjaxFailed(result) {
              alert(result.status + ' ' + result.statusText);
              alert("Failure");
           }  

   </script>


</head>
<body>
   <form id="form1" runat="server">
   <div>
       <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
       <br />
       <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
       <br />

       <asp:Button ID="btnsubmit" runat="server" Text="Button" />
       <div id="output">
       </div>
   </div>
   </form>
</body>
</html>

Please help me to find out the reason and re-write the code.
Thanks in advance.

javascript

jquery

asp.net

asp.net-ajax

asked on Stack Overflow Jun 19, 2012 by

Sreeni Puthiyillam • edited Jun 19, 2012 by

Sreeni Puthiyillam

1 Answer

Because this is a POST, you need to return false for your form submit (e.g., btnsubmit's client-side handler). Also, as TextBox1 and TextBox2 are of type <asp:TextBox>, you need to capture their ClientID to reference them correctly in client-side script. The code below should work.

function AjaxSucceeded(result) {
    alert(result.d);
    var Emp = result.d;
    $("#output").append('<p>' + Emp.Sname + ' ' + Emp.Sno + '</p>');
}

function AjaxFailed(result) {
    alert(result.status + ' ' + result.statusText);
    alert("Failure");
}

$(document).ready(function() {
    $("#btnsubmit").click(function(e) {
        $.ajax({
            "type": "POST",
            "url": "loginform.aspx/getdataval",
            "data": "{'uname':'" + $("#<%=TextBox1.ClientID %>").val() + "','passwod':'" + $("#<%=TextBox2.ClientID %>").val() + "'}",
            "contentType": "application/json;charset=utf-8",
            "dataType": "json",
            "success": function(msg) {
                alert("welcome");
                AjaxSucceeded(msg);
            },
            "error": AjaxFailed
        });
        //required because "type" is "POST"
        e.preventDefault();
        return false;
        //although it's a good idea anyway because we
        //don't want a postback.
    });
});

answered on Stack Overflow Jun 20, 2012 by

pete • edited May 23, 2017 by

Community

User contributions licensed under CC BY-SA 3.0