NetTalk Central

Author Topic: Body Div Class - generates blank <div> tags  (Read 3657 times)

riavanheerden

  • Newbie
  • *
  • Posts: 2
    • View Profile
    • Email
Body Div Class - generates blank <div> tags
« on: March 23, 2012, 04:16:51 AM »
I created a new webserver and it calls a NetWebPage with code that i added to it.

My problem is that when the code is compiled and run it generates a blank <div> </div> because I removed the class name under "Body Div Class" under NetTalk or NetSimple Object(3) Extention - Settings tab - Styles tab - Site tab

The code that is generated with NetTalk is as follows:

<!DOCTYPE html><html class="nt-html no-js">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<script src="scripts/codebase/dhtmlxscheduler.js" type="text/javascript" charset="utf-8"></script>   
<link rel="stylesheet" href="scripts/codebase/dhtmlxscheduler.css" type="text/css" media="screen" title="no title" charset="utf-8">
<link href="/themes/ui-lightness/jquery-ui.css" rel="stylesheet" />
<link href="/styles/jquery-nt-color.css" rel="stylesheet" />
<link href="/styles/jquery-nt-menu.css" rel="stylesheet" />
<link href="/styles/jquery-nt-cal.css" rel="stylesheet" />
<link href="/styles/netweb.css" rel="stylesheet" />
<link href="/themes/ui-lightness/nettalk-ui.css" rel="stylesheet" />
<link href="/styles/chrome.css" rel="stylesheet" />
<link href="/styles/" rel="stylesheet" />
<script src="/scripts/modernizr.custom.js" type="text/javascript"></script>
<script src="/scripts/jquery-1.7.0.min.js" type="text/javascript"></script>
<script src="/scripts/jquery-ui-1.8.17.custom.min.js" type="text/javascript"></script>
<script src="/scripts/jquery.corners.js" type="text/javascript"></script>
<script src="/scripts/jquery.form.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-form.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-menu.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-wiz.js" type="text/javascript"></script>
<script src="/scripts/jquery.metadata.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-color.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-dialog.js" type="text/javascript"></script>
<script src="/scripts/netweb.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-browse.js" type="text/javascript"></script>
<script src="/scripts/jcanvas.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-cal.js" type="text/javascript"></script>
<script src="/scripts/" type="text/javascript"></script>
<style type="text/css" media="screen">   
html, body{      
      margin:0px;      
      padding:0px;      
      height:100%;      
      overflow:hidden;   
      }   
</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(2010,7,5),"week");      
    scheduler.load("../common/events2010.xml");         
}
</script>
</head>
<body class="blah" onload="init();">
    <div>
      <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>
   </div>
</body>
</html>
This only gives me a blank page

When i edit the page through firebug and remove the blank <div> tags - like this:

<!DOCTYPE html><html class="nt-html no-js">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<script src="scripts/codebase/dhtmlxscheduler.js" type="text/javascript" charset="utf-8"></script>   
<link rel="stylesheet" href="scripts/codebase/dhtmlxscheduler.css" type="text/css" media="screen" title="no title" charset="utf-8">
<link href="/themes/ui-lightness/jquery-ui.css" rel="stylesheet" />
<link href="/styles/jquery-nt-color.css" rel="stylesheet" />
<link href="/styles/jquery-nt-menu.css" rel="stylesheet" />
<link href="/styles/jquery-nt-cal.css" rel="stylesheet" />
<link href="/styles/netweb.css" rel="stylesheet" />
<link href="/themes/ui-lightness/nettalk-ui.css" rel="stylesheet" />
<link href="/styles/chrome.css" rel="stylesheet" />
<link href="/styles/" rel="stylesheet" />
<script src="/scripts/modernizr.custom.js" type="text/javascript"></script>
<script src="/scripts/jquery-1.7.0.min.js" type="text/javascript"></script>
<script src="/scripts/jquery-ui-1.8.17.custom.min.js" type="text/javascript"></script>
<script src="/scripts/jquery.corners.js" type="text/javascript"></script>
<script src="/scripts/jquery.form.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-form.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-menu.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-wiz.js" type="text/javascript"></script>
<script src="/scripts/jquery.metadata.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-color.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-dialog.js" type="text/javascript"></script>
<script src="/scripts/netweb.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-browse.js" type="text/javascript"></script>
<script src="/scripts/jcanvas.js" type="text/javascript"></script>
<script src="/scripts/jquery.nt-cal.js" type="text/javascript"></script>
<script src="/scripts/" type="text/javascript"></script>
<style type="text/css" media="screen">   
html, body{      
      margin:0px;      
      padding:0px;      
      height:100%;      
      overflow:hidden;   
      }   
</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(2010,7,5),"week");      
    scheduler.load("../common/events2010.xml");         
}
</script>
</head>
<body class="blah" onload="init();">
      <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>
</body>
</html>

- then the code works

How can I remove the div tags that is created by the Body Div Class?

Bruce

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 11250
    • View Profile
Re: Body Div Class - generates blank <div> tags
« Reply #1 on: March 23, 2012, 05:39:34 AM »
This appears to be a problem of the external JavaScript you are using. Clearly wrapping the
<div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'> 
div with another div should not be a problem, unless the scheduler thing is having some requirement of the parent tag.

assuming this is the component you're using;
http://docs.dhtmlx.com/doku.php?id=dhtmlxscheduler:faq
it would appear that it requires the parent container to have the height set specifically.

so try creating a style;
.ria-div {
margin:0px;
padding:0px;
height:100%; /*mandatory*/
overflow:hidden;
}

and then apply the ria-div class to the Body div.

you may also need to apply the ria-div class to the <body> tag as well.

cheers
Bruce



riavanheerden

  • Newbie
  • *
  • Posts: 2
    • View Profile
    • Email
Re: Body Div Class - generates blank <div> tags
« Reply #2 on: March 23, 2012, 05:50:19 AM »
That style has already been applied in the code.

I changed the Body Div Class to display the code - <div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:100%;'>  

But it only displays:
<div class="dhx_cal_container" id="scheduler_here" style="width:100%;he">  

Which tells me the Body Div Class only allows for about 60 characters - if I edit the page source with firebug and complete the height:100%; the the page displays correctly

Is it possible to get the Body Div Class to display more characters?

Kind Regards
Ria

Rob de Jager

  • Jr. Member
  • **
  • Posts: 54
    • View Profile
Re: Body Div Class - generates blank <div> tags
« Reply #3 on: March 24, 2012, 06:52:20 AM »
Hi Ria

To overcome the class description size limit, you can move the style properties into the div class via your style file.

.dhx_cal_container {
height: 100%;
width: 100%;
}

Cheers

Rob