This is a migrated thread and some comments may be shown as answers.

Calling Asp.Net Web Api in Kendo UI html page

1 Answer 310 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

Nithya asked on 30 Oct 2013, 08:05 AM

Dear All,

I have created the web api and deployed it.in the html page using the kendo Ui

"<head>
    
    <link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
    
    <link href="styles/kendo.default.min.css" rel="stylesheet" type="text/css" />

    
    <script src="js/jquery.min.js"></script>
    
    <script src="js/kendo.all.min.js"></script>

    <title>Dashboard</title>
</head>
<body>

    <div id="example" class="k-content">

        <div class="grid-wrapper">

            <div id="grid"></div>

            <script>
                var remoteDataSource = new kendo.data.DataSource({
                    transport: {
                        read: {
                            url: "http://localhost:2704/api/employee",
                            dataType: "jsonp"
                        }
                    },
                    schema: {
                        model: {
                            id: "Id",
                            fields: {
                                Id: { type: "number" },
                                FirstName: { type: "string" },
                                LastName: { type: "string" }
                            }
                        }
                    }

                });

                $("#grid").kendoGrid({
                    dataSource: remoteDataSource,
                    height: 200
                });

            </script>
        </div>

        <div class="table-wrapper">
            <div id="divResult">

                <script>
                    function GetAllProducts() {
                        jQuery.support.cors = true;
                        $.ajax({
                            url: 'http://localhost:2704/api/employee',
                            dataType: 'jsonp',
                            success: function (data) {
                                WriteResponse(data);
                            },
                        });
                    }
                    function WriteResponse(products) {
                        var strResult = "<table><th>ID</th><th>FirstName</th><th>LastName</th>";
                        $.each(products, function (index, product) {
                            strResult += "<tr><td>" + product.Id + "</td><td> " + product.FirstName + "</td><td>" + product.LastName + "</td></tr>";
                        });
                        strResult += "</table>";
                        $("#divResult").html(strResult);
                    }

                    $(document).ready(function () {
                        GetAllProducts();
                    });
                </script>
            </div>
        </div>
    </div>

</body>"

im calling the the api the response headers are empty.when i access the api it is working fine.Can anyone help how to intergerate the web api with the Kendo UI html pages.

Calling Asp.Net Web Api in Kendo UI html page

1 Answer, 1 is accepted