Question

您好我已将dhtmlxScheduler事件日历添加到我的网站，它运行正常。我只是在将其纳入我的网站设计布局时遇到了一些麻烦。我的网站是使用ASP.Net和razor视图引擎开发的。我使用_Layout.cshtml页面为我的所有页面添加一致的设计，方法是将以下代码添加到所有页面的顶部“Layout =”〜/ _Layout.cshtml“;” 我添加的页面包含dhtmlScheduler事件日历，称为Calender.cshtml。我试图在Calendar.cshtml页面中包含_layout页面，但它没有工作，所以我只是将网站页眉和页脚设计添加到Calendar.cshtml它工作，但页面仍然看起来不同于其他页面上网站，我的意思是所有其他页面都有一个居中的页面布局，而日历页面似乎与左边对齐。我将添加图像以显示页面之间的差异。我只是想知道是否有人将dhtmlScheduler添加到他们的网站并设法将他们的网站布局设计包含在活动日历中。

布局代码页面：

<!DOCTYPE html>
<html>
<head>
<title>@Page.Title</title>
<link href="~/Styles/Style1.css" rel="stylesheet" type="text/css" />     
</head>
<body >
<div id="container">
    <div id="header">
      <h1>Annual Leave Management System</h1>
    </div>
    <div id="main">
      @RenderBody()
    </div>


    <div id="footer">
      &copy; @DateTime.Now.Year Annual Leave Management System
    </div>
  </div>
  </body>
  </html>

日历页面的代码：

@{

//Layout = "~/_Layout.cshtml";
Page.Title = "Leave Calendar";   

}


<!DOCTYPE html>

<html lang="en">
<head>
     <title>@Page.Title</title>
<link href="~/Styles/Style1.css" rel="stylesheet" type="text/css" />

    <meta charset="utf-8" />
    <title>dhtmlxScheduler</title>
    <script src="@Href("~/Scripts/dhtmlxScheduler/dhtmlxscheduler.js")"></script>
    <script           src="@Href("~/Scripts/dhtmlxScheduler/ext/dhtmlxscheduler_dhx_terrace.js")"></script>
    <link href="@Href("~/Scripts/dhtmlxScheduler/dhtmlxscheduler_dhx_terrace.css")"   type="text/css" rel="stylesheet">

       <style>
        html, body{
            height: 100%;
            margin: 0;
        }
    </style>

    <script type="text/javascript" charset="utf-8">
        function init() {
            scheduler.config.multi_day = true;

            scheduler.config.xml_date = "%Y-%m-%d %H:%i";
            scheduler.init('scheduler_here', new Date(2014, 3, 7), "month");

            scheduler.load("@Href("~/data.cshtml")");
            var dp = new dataProcessor("@Href("~/save.cshtml")");

            dp.init(scheduler);
            dp.setTransactionMode("POST", false);
            }
          </script>
          </head>
      <body onload="init();">

     <div id="header" style='width:80%;'>
      <h1>Annual Leave Management System</h1>
    </div>
    <div id="scheduler_here" class="dhx_cal_container" style='width:81%;  height:70%;'>


        <div class="dhx_cal_navline" >

            <div class="dhx_cal_prev_button">&nbsp;</div>
            <div class="dhx_cal_next_button">&nbsp;</div>
            <div class="dhx_cal_today_button"></div>
            <div class="dhx_cal_date"></div>
            <div class="dhx_cal_tab" name="day_tab" style="right:204px;"> </div>
            <div class="dhx_cal_tab" name="week_tab" style="right:140px;"> </div>
            <div class="dhx_cal_tab" name="month_tab" style="right:76px;"></div>
          </div>
          <div class="dhx_cal_header">
          </div>
          <div class="dhx_cal_data">
          </div>

    </div>

<a href="@Href("~/Logout")">Log out</a>
<br/>
<a href="@Href("~/Home")">Home</a>
<br/>

    &copy; @DateTime.Now.Year Annual Leave Management System

    </body>

 </html>

图片：

包含_layout.cshtml的

页面：

enter image description here

日历页面：

enter image description here

dhtmlxScheduler - ASP.net剃须刀

0 个答案: