2016-11-07 100 views
1

我有一些与引导程序相关的问题。我试图在两个网格上分页,即col-lg6。在我将类添加到div后,我得到空白页面。DHTMLX调度程序与引导程序冲突

这是我的HTML

<div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'> 
     <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> 


<style type="text/css" media="screen"> 
    html, body { 
     margin: 0px; 
     padding: 0px; 
     height: 100%; 
     overflow: hidden; 
    } 
</style> 

,在这里我有脚本

<script type="text/javascript"> 

    scheduler.init('scheduler_here', new Date(), "week"); 


    scheduler.form_blocks["my_editor"] = { 
     render: function (sns) { 
      return "<div class='dhx_cal_ltext' style='height:380px;'>" + 
       "<div class='col-lg-6'>" + 
       "<p>Nazwa posiłku </p><input type='text' class='form-control'></input>" + 
       "<p>Przygotowanie posiłku:</p> <textarea type='text' class='form-control' style='width: 100%;height: 50px; font-size: smaller; line-height: normal'></textarea>" + 
       "<br/>" + 
       "</div>" + 
       "<div class='col-lg-6'>" + 
       "<p>Składniki</p>" + 
       "<textarea type='text' class='form-control' style='width: 100%;height: 150px; font-size: smaller; line-height: normal;'></textarea>" + 
       "</div>" + 
       "<p style='margin-left:15px;'>Lista produktów: </p><select class='js-example-basic-single' multiple='multiple' style='width: 98%; margin-left:15px;' id='lightboxCalendar'></select>" + 
       "</div><br>"; 
     }, 
     set_value: function (node, value, ev) { 
      $.ajax({ 
       url: "/Calendar/GetDataForInvoiceNumber", 
       data: { 'key': '2112sd' }, 
       type: "post", 
       dataType: "json", 
       success: function (data) { 
        var inner = ""; 
        for (var i = 0; i < data.length; i++) { 
         inner += "<option value='" + data[i].id + "'>" + data[i].Nazwa_Produktu + "</option>"; 
        } 

        document.getElementById("lightboxCalendar").innerHTML = inner;      
       }, 
       error: function (xhr, ajaxOptions, thrownError) { 
        var err = eval("(" + xhr.responseText + ")"); 
        alert(err.Message); 
       } 
      }); 
      $(".js-example-basic-single").select2(); 
     }, 
     get_value: function (node, ev) { 
      ev.location = node.childNodes[4].value; 
      return node.childNodes[1].value; 
     }, 
     focus: function (node) { 
      //var a = node.childNodes[1]; s 
     } 
    } 
    scheduler.config.lightbox.sections = [ 
     { name: "description", height: 500, map_to: "text", type: "my_editor", focus: true } 
    ] 


    var events = [ 
{ id: 1, text: "Meeting", start_date: "04/11/2013 14:00", end_date: "04/11/2013 17:00" }, 
{ id: 2, text: "Conference", start_date: "04/15/2013 12:00", end_date: "04/18/2013 19:00" }, 
{ id: 3, text: "Interview", start_date: "04/24/2013 09:00", end_date: "04/24/2013 10:00" } 
    ]; 

    scheduler.parse(events, "json");//takes the name and format of the data source 
</script> 

如果我创建两个div例如

<div class='col-lg-6'>---HERE IS CALENDAR---</div> 
<div class='col-lg-6'>---WHATEVER</div> 

我的网站是空白。看起来dhtmlx与bootstrap有一些冲突。你有什么想法可能是错的?

感谢您的帮助!

+0

你是否修复了这个问题?你可以分享吗? –

+0

@GregoireMulliez我无法修复它,所以我切换到具有几乎相同功能的完整日历 – Icet

回答

0

我固定的DHTMLX支持一些帮助的问题 我的错误是“忘记”来定义我的网 内部的大小我的div与一对夫妇COL-SM-X(COL-SM-3 &的col-sm-9)如果像魅力一样工作