2

我需要有关 HTML5 的代码帮助。我有网络服务运行数据库并返回 JSON 数据。但是，对于 HTML5 客户端部分，如何使用它以及如何显示对我来说是一个问题。

WebMethod 是“GetItemData”，JSON 数据的返回类型是 String。数据库表包括：ItemID、ItemName、ItemPrice 和 ItemOnHand 列。

我正在成功发布我的网络服务。

请帮我解决这个编码问题。我附上 HTML5 客户端代码，以及这封邮件。从这里下载脚本和样式。JqxGrid 是一个 DataGrid 控件，可以显示从 JSON 到 Grid 的整个数据。

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="Scripts/jquery-1.8.2.min.js" type="text/javascript"></script>
    <link href="Styles/jqx.base.css" rel="stylesheet" type="text/css"/>
    <link href="Styles/jqx.classic.css" rel="stylesheet" type="text/css"/>
    <script src="Scripts/jqxcore.js" type="text/javascript"></script>
    <script src="Scripts/jqxbuttons.js" type="text/javascript"></script>
    <script src="Scripts/jqxdata.js" type="text/javascript"></script>
    <script src="Scripts/jqxgrid.js" type="text/javascript"></script>
    <script src="Scripts/jqxgrid.selection.js" type="text/javascript"></script>
    <script src="Scripts/jqxmenu.js" type="text/javascript"></script>
    <script src="Scripts/jqxscrollbar.js" type="text/javascript"></script>

<script type="text/javascript">
    function GetItemsData() {
        try {
            url = "http://localhost:1806/HTMLWebService.asmx/Getjsonitems",
            source = {
                datatype: "json",
                datafields: [
               { name: 'ItemID' },
               { name: 'ItemName' },
               { name: 'ItemPrice'}, 
               { name: 'ItemOnHand'}] 
               };

            $.ajax({
                type: "POST",
                dataType: "json",
                async: false,
                url: "http://localhost:1806/HTMLWebService.asmx/Getjsonitems",
                cache: false,
                contentType: "application/json; charset=utf-8",
                success: SucceedFunc,
                data: "{}",
                failure: FailedFunc
            });
        }
        catch (e) {
            alert('failed to call web service. Error: ' + e);
        }
    }

    function SucceedFunc(data, status) {
        debugger;
        alert("Enter into Success");
        source.localdata = data.d;
        alert(source.localdata = data.d);

        //Preparing the data for use
        var dataAdapter = new $.jqx.dataAdapter(source);
        $("#jqxgrid").jqxGrid({
            source: dataAdapter,
            theme: 'classic',
            columns: [
           { text: 'Item ID', dataField: 'ItemID', width: 250 },
           { text: 'Item Name', dataField: 'ItemName', width: 150 },
           { text: 'Item Price', dataField: 'ItemPrice', width: 180 },
           { text: 'Items On Hand', dataField: 'ItemOnHand', width: 180 }
           ]
        });
    }

    function FailedFunc(request, status, error) {
        debugger;
        alert("Error occured");
    }
</script>
</head>

<body onload="GetItemsData()">
<div id="jqxgrid"></div>
</body>
</html>
4

2 回答 2

0

尝试这个

$.ajax({
        cache: false,
        type: "GET",
        async: false,
        data: {},
        url: "1231212312312312.svc/webBinding/Result?metaTag=" + meta,
        contentType: "application/json; charset=utf-8",
        crossDomain: true,
        success: function(){},
        error: function(){}
      });
于 2013-07-10T06:30:57.100 回答
0

如果您可以发布您遇到的错误/问题，那么人们会更容易提供帮助。期望代表您运行代码会导致很少有人愿意提供帮助。

切入正题：您确定代码“POST”中使用的 HTTP 方法是否正确。从网络服务的作用来看，它只是从数据库中获取数据。因此，用于这种 Web 服务的常用 HTTP 动词（因为它只是读取数据而不是修改）是 GET。在这种情况下，您也应该在 $.ajax 中使用 GET ......

尝试，

$.ajax({
                type: "GET",
                url: "http://localhost:1806/HTMLWebService.asmx/Getjsonitems",
                async: false,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                cache: false,
                success: SucceedFunc,
                data: "{}", // You don't necessarily have to put this.
                failure: FailedFunc
            });
于 2020-11-05T06:16:49.373 回答