Hello I have a problem displaying the grid. My code is not working properly after you run the page is not displayed correctly. You can look at the pictures.
Is my code
Is code generate kendo
Is my code
<script type="text/javascript"> $(document).ready( function () { var bidDataSource = new window.kendo.data.DataSource({ transport: { read: { dataType: "json", type: "POST", url: '@Url.Action("NewBids","Bid")' }, schema: { model: { id: "Id" } } } }); var bidsGrid = $("#bidsGrid").kendoGrid({ dataSource: bidDataSource, height: 250, pageable: true, scrollable: false, selectable: "row", columns: [ { field: "Id", width: 90, title: "Id" } ] }); });</script><div id="bidsGrid"></div>Is code generate kendo
<html><head> <title>Новые заявки</title> <script src="/static/Scripts/jquery-1.8.2.js" type="text/javascript"></script><style type="text/css"></style> <script src="/static/Scripts/kendo/2012.2.710/kendo.web.min.js" type="text/javascript"></script> <link href="/static/Content/kendo/2012.2.710/kendo.default.min.css" rel="stylesheet" type="text/css"> <style id="wrc-middle-css" type="text/css">.wrc_whole_window{ display: none; position: fixed; z-index: 2147483647; background-color: rgba(40, 40, 40, 0.9); word-spacing: normal !important; margin: 0px !important; padding: 0px !important; border: 0px !important; left: 0px; top: 0px; width: 100%; height: 100%; line-height: normal !important; letter-spacing: normal !important; overflow: hidden;}.wrc_bar_window{ display: none; position: fixed; z-index: 2147483647; background-color: rgba(60, 60, 60, 1.0); word-spacing: normal !important; font-family: Segoe UI, Arial Unicode MS, Arial, Sans-Serif; margin: 0px !important; padding: 0px !important; border: 0px !important; left: 0px; top: 0px; width: 100%; height: 40px; line-height: normal !important; letter-spacing: normal !important; color: white !important; font-size: 13px !important;}.wrc_middle { display: table-cell; vertical-align: middle; width: 100%;}.wrc_middle_main { font-family: Segoe UI, Arial Unicode MS, Arial, Sans-Serif; font-size: 14px; width: 600px; height: auto; background: url(chrome-extension://icmlaeflemplmjndnaapfdbbnpncnbda/skin/images/background-body.jpg) repeat-x left top; background-color: rgb(39, 53, 62); position: relative; margin-left: auto; margin-right: auto; text-align: left;}.wrc_middle_tq_main { font-family: Segoe UI, Arial Unicode MS, Arial, Sans-Serif; font-size: 16px; width: 615px; height: 460px; background: url(chrome-extension://icmlaeflemplmjndnaapfdbbnpncnbda/skin/images/background-sitecorrect.png) no-repeat; background-color: white; color: black !important; position: relative; margin-left: auto; margin-right: auto; text-align: center;}.wrc_middle_logo { background: url(chrome-extension://icmlaeflemplmjndnaapfdbbnpncnbda/skin/images/logo.jpg) no-repeat left bottom; width: 140px; height: 42px; color: orange; display: table-cell; text-align: right; vertical-align: middle;}.wrc_icon_warning { margin: 20px 10px 20px 15px; float: left; background-color: transparent;}.wrc_middle_title { color: #b6bec7; height: auto; margin: 0px auto; font-size: 2.2em; white-space: nowrap; text-align: center;}.wrc_middle_hline { height: 2px; width: 100%; display: block;}.wrc_middle_description { text-align: center; margin: 15px; font-size: 1.4em; padding: 20px; height: auto; color: white; min-height: 3.5em;}.wrc_middle_actions_main_div { margin-bottom: 15px; text-align: center;}.wrc_middle_actions_blue_button div { display: inline-block; width: auto; cursor: Pointer; margin: 3px 10px 3px 10px; color: white; font-size: 1.2em; font-weight: bold;}.wrc_middle_actions_blue_button { -moz-appearance: none; border-radius: 7px; -moz-border-radius: 7px/7px; border-radius: 7px/7px; background-color: rgb(0, 173, 223) !important; display: inline-block; width: auto; cursor: Pointer; border: 2px solid #00dddd; padding: 0px 20px 0px 20px;}.wrc_middle_actions_blue_button:hover { background-color: rgb(0, 159, 212) !important;}.wrc_middle_actions_blue_button:active { background-color: rgb(0, 146, 200) !important; border: 2px solid #00aaaa;}.wrc_middle_actions_grey_button div { display: inline-block; width: auto; cursor: Pointer; margin: 3px 10px 3px 10px; color: white !important; font-size: 15px; font-weight: bold;}.wrc_middle_actions_grey_button { -moz-appearance: none; border-radius: 7px; -moz-border-radius: 7px/7px; border-radius: 7px/7px; background-color: rgb(100, 100, 100) !important; display: inline-block; width: auto; cursor: Pointer; border: 2px solid #aaaaaa; text-decoration: none; padding: 0px 20px 0px 20px;}.wrc_middle_actions_grey_button:hover { background-color: rgb(120, 120, 120) !important;}.wrc_middle_actions_grey_button:active { background-color: rgb(130, 130, 130) !important; border: 2px solid #00aaaa;}.wrc_middle_action_low { font-size: 0.9em; white-space: nowrap; cursor: Pointer; color: grey !important; margin: 10px 10px 0px 10px; text-decoration: none;}.wrc_middle_action_low:hover { color: #aa4400 !important;}.wrc_middle_actions_rest_div { padding-top: 5px; white-space: nowrap; text-align: center;}.wrc_middle_action { white-space: nowrap; cursor: Pointer; color: red !important; font-size: 1.2em; margin: 10px 10px 0px 10px; text-decoration: none;}.wrc_middle_action:hover { color: #aa4400 !important;}</style><script id="wrc-script-middle_window" type="text/javascript" language="JavaScript">var g_inputsCnt = 0;var g_InputThis = new Array(null, null, null, null);var g_alerted = false;/* we test the input if it includes 4 digits (input is a part of 4 inputs for filling the credit-card number)*/function is4DigitsCardNumber(val){ var regExp = new RegExp('[0-9]{4}'); return (val.length == 4 && val.search(regExp) == 0);}/* testing the whole credit-card number 19 digits devided by three '-' symbols or exactly 16 digits without any dividers*/function isCreditCardNumber(val){ if(val.length == 19) { var regExp = new RegExp('[0-9]{4}-[0-9]{4}-[0-9]{4}-[0-9]{4}'); return (val.search(regExp) == 0); } else if(val.length == 16) { var regExp = new RegExp('[0-9]{4}[0-9]{4}[0-9]{4}[0-9]{4}'); return (val.search(regExp) == 0); } return false;}function CheckInputOnCreditNumber(self){ if(g_alerted) return false; var value = self.value; if(self.type == 'text') { if(is4DigitsCardNumber(value)) { var cont = true; for(i = 0; i < g_inputsCnt; i++) if(g_InputThis[i] == self) cont = false; if(cont && g_inputsCnt < 4) { g_InputThis[g_inputsCnt] = self; g_inputsCnt++; } } g_alerted = (g_inputsCnt == 4); if(g_alerted) g_inputsCnt = 0; else g_alerted = isCreditCardNumber(value); } return g_alerted;}function CheckInputOnPassword(self){ if(g_alerted) return false; var value = self.value; if(self.type == 'password') { g_alerted = (value.length > 0); } return g_alerted;}function onInputBlur(self, bRatingOk, bFishingSite){ var bCreditNumber = CheckInputOnCreditNumber(self); var bPassword = CheckInputOnPassword(self); if((!bRatingOk || bFishingSite == 1) && (bCreditNumber || bPassword) ) { var warnDiv = document.getElementById("wrcinputdiv"); if(warnDiv) { /* show the warning div in the middle of the screen */ warnDiv.style.left = "0px"; warnDiv.style.top = "0px"; warnDiv.style.width = "100%"; warnDiv.style.height = "100%"; document.getElementById("wrc_warn_fs").style.display = 'none'; document.getElementById("wrc_warn_cn").style.display = 'none'; if(bFishingSite) document.getElementById("wrc_warn_fs").style.display = 'block'; else document.getElementById("wrc_warn_cn").style.display = 'block'; warnDiv.style.display = 'table'; } }}</script></head> <body> <script type="text/javascript"> $(document).ready( function () { var bidDataSource = new window.kendo.data.DataSource({ transport: { read: { dataType: "json", type: "POST", url: '/Bid/NewBids' }, schema: { model: { id: "Id" } } } }); var bidsGrid = $("#bidsGrid").kendoGrid({ dataSource: bidDataSource, height: 250, pageable: true, scrollable: false, selectable: "row", columns: [ { field: "Id", width: 90, title: "Id" } ] }); });</script><div id="bidsGrid" data-role="grid" class="k-grid k-widget" tabindex="0" style="height: 250px; "><table cellspacing="0" style="height: auto; " class="k-focusable k-selectable" data-role="selectable"><colgroup><col style="width:90px"></colgroup><thead class="k-grid-header"><tr><th data-field="Id" data-title="Id" class="k-header">Id</th></tr></thead><tbody><tr data-uid="2a202132-59d1-4494-ac0b-986594c09da8"><td>1</td></tr></tbody></table><div class="k-pager-wrap k-grid-pager" data-role="pager"><a href="#" title="Go to the first page" class="k-link" data-page="1"><span class="k-icon k-i-seek-w">Go to the first page</span></a><a href="#" title="Go to the previous page" class="k-link" data-page="NaN"><span class="k-icon k-i-arrow-w">Go to the previous page</span></a><ul class="k-pager-numbers k-reset"><li><a href="#" class="k-link" data-page="1">1</a></li></ul><a href="#" title="Go to the next page" class="k-link" data-page="NaN"><span class="k-icon k-i-arrow-e">Go to the next page</span></a><a href="#" title="Go to the last page" class="k-link" data-page="1"><span class="k-icon k-i-seek-e">Go to the last page</span></a><span class="k-pager-info k-label">NaN - NaN of 1 items</span></div></div> </body></html>