为什么我的jquery数据表没有填满?

时间:2017-08-02 13:17:22

标签: javascript jquery json ajax web-services

我正在尝试从.asmx web服务填充我的jquery数据表,但是抛出内部服务器500错误。

为什么?

 [WebMethod(EnableSession = true)]
        [ScriptMethod(ResponseFormat = ResponseFormat.Json, UseHttpGet=true)]
        //[ScriptMethod(UseHttpGet = true)]
        public string getUsers()
        {
            try
            {
                basicoperation bop = new basicoperation();
               // Context.Response.Output.Write(bop.getUsers());
                DataTable dt;

                dt= bop.getUsers();

                dt.TableName = "usersDT";

                string json = JsonConvert.SerializeObject(dt);

                return json;
            }
            catch (Exception ex)
            {

                throw ex;
            }


        }

此网络服务返回

此XML文件似乎没有与之关联的任何样式信息。文档树如下所示。

<string xmlns="http://tempuri.org/">
[{"ID":1,"UserName":"Yasir","Password":"123"},{"ID":2,"UserName":"asd","Password":"asdasd"},{"ID":3,"UserName":"Tester","Password":"123"},{"ID":4,"UserName":"rqads","Password":"12"},{"ID":5,"UserName":"asd","Password":"asda"},{"ID":6,"UserName":"asd","Password":"asda"},{"ID":7,"UserName":"hunain","Password":"123"},{"ID":8,"UserName":"hunain","Password":"123"},{"ID":9,"UserName":"username","Password":"123"},{"ID":10,"UserName":"","Password":""},{"ID":11,"UserName":"da","Password":"asd"},{"ID":12,"UserName":"sdas","Password":"asdas"},{"ID":13,"UserName":"","Password":""},{"ID":14,"UserName":"fdsf","Password":"sf"},{"ID":15,"UserName":"","Password":""},{"ID":16,"UserName":"","Password":""},{"ID":17,"UserName":"","Password":""}]
</string>

但是,它仍无效。

这是我的js代码:

<!DOCTYPE html>
<html>
    <head>

        <link href="css/bootstrap.min.css" rel="stylesheet">
        <link href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css" rel="stylesheet">

        <style>
            .container-fluid
            {
                width: 40%;
                margin-left: 35% !important;
                margin-top: 10%  !important;
                border-style: ridge;
                padding-bottom: 10px;
                padding-top: 10px;
                border-width: 1px;

            }
        </style>
        <script type="text/javascript">

            function save()
            {
                $.post(
                    "http://localhost:8373/himher.asmx/InsertUsers",
                    {name: txtUserName.value, pwd: txtUserPwd.value},
                    function(data, status)
                    {
                        alert(data);

                    }
                );
            }

            function show()
            {
                $.ajax({

                    url: 'http://localhost:8373/himher.asmx/getUsers',
                    method: 'get',
                    dataType: 'json',
                    success: function (data){

                    $('#example').DataTable( {

                            data: data,                         
                            columns: [

                                  {"data": "ID" },
                                  {"data": "UserName" },
                                  {"data": "Password" },
                                    ]
                                }); 
                        }
                  });
            }

        </script>

    </head>
<body> 
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                 <label>User Name</label>
                 <input id="txtUserName" type="text" class="form-control" />
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                 <label>Password</label>
                 <input id="txtUserPwd" type="text" class="form-control" />
            </div>
        </div>    
        <br/>
         <div class="row">
            <div class="col-md-06">     
                 <button type="submit" onclick='save()' class="btn btn-primary pull-right">Register</button>
            </div>     

            <div class="col-md-06">
                <button type="submit" onclick='show()' class="btn btn-primary pull-right">Show</button>
            </div>
        </div>  
    </div>  
    <div class="container-fluid">
        <table id="example" class="display" width="100%"></table>
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="//code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
     <script src="js/bootstrap.min.js" type="text/javascript"></script>
</body>

</html>

我在点击按钮时调用show()函数。我花了整整一天时间,它仍然没有用。在这方面,将非常感谢帮助。

0 个答案:

没有答案