Untitled

<!DOCTYPE>
<html ng-app="demoApp">
<head>
    <title>Button directive from attribute for AngularJS</title>
    <link rel="stylesheet" type="text/css" href="/Scripts/jqwidgets/styles/jqx.base.css" />
    <script type="text/javascript" src="/Scripts/jqwidgets/scripts/angular.min.js"></script>
    <script type="text/javascript" src="/Scripts/jqwidgets/scripts/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="/Scripts/jqwidgets/jqx-all.js"></script>
    <script type="text/javascript" src="/Scripts/jqwidgets/jqxangular.js"></script>

    <script type="text/javascript">
        var demoApp = angular.module("demoApp", ["jqwidgets"]);
        demoApp.controller("demoController", function ($scope) {
            // prepare the data
            var source =
            {
                datatype: "json",
                id: 'Id',
                url: 'http://localhost:12325/api/doctors',
                pagesize: 2
            };

            $scope.dataAdapter = new $.jqx.dataAdapter(source);

            $scope.gridSettings =
            {
                source: $scope.dataAdapter
            };
        });
    </script>
</head>
<body>
    <div ng-controller="demoController">
        <jqx-grid jqx-settings="gridSettings"
                  jqx-width="850"
                  jqx-source="dataAdapter"
                  jqx-columns="[
                    { text: 'Imie' , datafield: 'FirstName' },
                    { text: 'Nazwisko' , datafield: 'LastName' },
                    { text: 'Kod' , datafield: 'PostalCode' },
                    { text: 'Miejscowość' , datafield: 'City' },
                    { text: 'Ulica' , datafield: 'Street' },
                    { text: 'Specializacja' , datafield: 'Specialization' },
                    { text: 'Prawodozawodu' , datafield: 'PractiseRight' }]">


        </jqx-grid>
    </div>
</body>
</html>