Solved

URGENT 500 Editable Select Box

Posted on 2006-06-13
20
767 Views
Last Modified: 2008-01-16
Hello Experts,

I found a perfect example of editing a select box... but i can't get it to work :(

http://www.dhtmlgoodies.com/scripts/form_widget_editable_select/form_widget_editable_select.html

If i just copy the code straight from site into a new page it works fine but i seem to be having problems using it within my table.

Can someone please send me a sample of another one that will work or give me a solution to fixing this one.

I am posting working code and not working code after this.

Thanks in advance


Dave G
0
Comment
Question by:davecestria
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 11
  • 9
20 Comments
 
LVL 6

Author Comment

by:davecestria
ID: 16894323
WORKING CODE***************

<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-85864-2";
urchinTracker();
</script>      
      <style type="text/css">
      body{
            background-image:url('../../images/heading3.gif');
            background-repeat:no-repeat;
            padding-top:85px;      
            font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;
            font-size:0.9em;
            line-height:130%;

      }
      
      
      .selectBoxArrow{
            margin-top:1px;
            float:left;
            position:absolute;
            right:1px;
            

      }      
      .selectBoxInput{
            border:0px;
            padding-left:1px;
            height:16px;
            position:absolute;
            top:0px;
            left:0px;
      }

      .selectBox{
            border:1px solid #7f9db9;
            height:20px;      
      
      }
      .selectBoxOptionContainer{
            position:absolute;
            border:1px solid #7f9db9;
            height:100px;
            background-color:#FFF;
            left:-1px;
            top:20px;
            visibility:hidden;
            overflow:auto;
      }
      .selectBoxAnOption{
            font-family:arial;
            font-size:12px;
            cursor:default;
            margin:1px;
            overflow:hidden;
            white-space:nowrap;
      }
      </style>
      <script type="text/javascript">
      /************************************************************************************************************
      (C) www.dhtmlgoodies.com, September 2005
      
      This is a script from www.dhtmlgoodies.com. You will find this and a lot of other scripts at our website.      
      
      Terms of use:
      You are free to use this script as long as the copyright message is kept intact. However, you may not
      redistribute, sell or repost it without our permission.
      
      Thank you!
      
      www.dhtmlgoodies.com
      Alf Magne Kalleland
      
      ************************************************************************************************************/      
      
      // Path to arrow images
      var arrowImage = './images/select_arrow.gif';      // Regular arrow
      var arrowImageOver = './images/select_arrow_over.gif';      // Mouse over
      var arrowImageDown = './images/select_arrow_down.gif';      // Mouse down

      
      var selectBoxIds = 0;
      var currentlyOpenedOptionBox = false;
      var editableSelect_activeArrow = false;
      

      
      function selectBox_switchImageUrl()
      {
            if(this.src.indexOf(arrowImage)>=0){
                  this.src = this.src.replace(arrowImage,arrowImageOver);      
            }else{
                  this.src = this.src.replace(arrowImageOver,arrowImage);
            }
            
            
      }
      
      function selectBox_showOptions()
      {
            if(editableSelect_activeArrow && editableSelect_activeArrow!=this){
                  editableSelect_activeArrow.src = arrowImage;
                  
            }
            editableSelect_activeArrow = this;
            var optionDiv = document.getElementById('selectBoxOptions' + this.id.replace(/[^\d]/g,''));
            if(optionDiv.style.display=='block'){
                  optionDiv.style.display='none';
                  this.src = arrowImageOver;      
            }else{                  
                  optionDiv.style.display='block';
                  this.src = arrowImageDown;      
                  if(currentlyOpenedOptionBox && currentlyOpenedOptionBox!=optionDiv)currentlyOpenedOptionBox.style.display='none';      
                  currentlyOpenedOptionBox= optionDiv;                  
            }
      }
      
      function selectOptionValue()
      {
            var parentNode = this.parentNode.parentNode;
            var textInput = parentNode.getElementsByTagName('INPUT')[0];
            textInput.value = this.innerHTML;      
            this.parentNode.style.display='none';      
            document.getElementById('arrowSelectBox' + parentNode.id.replace(/[^\d]/g,'')).src = arrowImageOver;
      }
      var activeOption;
      function highlightSelectBoxOption()
      {
            if(this.style.backgroundColor=='#316AC5'){
                  this.style.backgroundColor='';
                  this.style.color='';
            }else{
                  this.style.backgroundColor='#316AC5';
                  this.style.color='#FFF';                  
            }      
            
            if(activeOption){
                  activeOption.style.backgroundColor='';
                  activeOption.style.color='';                  
            }
            activeOption = this;
            
      }
      
      function createEditableSelect(dest)
      {

            dest.className='selectBoxInput';            
            var div = document.createElement('DIV');
            div.style.styleFloat = 'left';
            div.style.width = dest.offsetWidth + 16 + 'px';
            div.style.position = 'relative';
            div.id = 'selectBox' + selectBoxIds;
            var parent = dest.parentNode;
            parent.insertBefore(div,dest);
            div.appendChild(dest);      
            div.className='selectBox';
            div.style.zIndex = 10000 - selectBoxIds;

            var img = document.createElement('IMG');
            img.src = arrowImage;
            img.className = 'selectBoxArrow';
            
            img.onmouseover = selectBox_switchImageUrl;
            img.onmouseout = selectBox_switchImageUrl;
            img.onclick = selectBox_showOptions;
            img.id = 'arrowSelectBox' + selectBoxIds;

            div.appendChild(img);
            
            var optionDiv = document.createElement('DIV');
            optionDiv.id = 'selectBoxOptions' + selectBoxIds;
            optionDiv.className='selectBoxOptionContainer';
            optionDiv.style.width = div.offsetWidth-2 + 'px';
            div.appendChild(optionDiv);
            
            if(dest.getAttribute('selectBoxOptions')){
                  var options = dest.getAttribute('selectBoxOptions').split(';');
                  var optionsTotalHeight = 0;
                  var optionArray = new Array();
                  for(var no=0;no<options.length;no++){
                        var anOption = document.createElement('DIV');
                        anOption.innerHTML = options[no];
                        anOption.className='selectBoxAnOption';
                        anOption.onclick = selectOptionValue;
                        anOption.style.width = optionDiv.style.width.replace('px','') - 2 + 'px';
                        anOption.onmouseover = highlightSelectBoxOption;
                        optionDiv.appendChild(anOption);      
                        optionsTotalHeight = optionsTotalHeight + anOption.offsetHeight;
                        optionArray.push(anOption);
                  }
                  if(optionsTotalHeight > optionDiv.offsetHeight){                        
                        for(var no=0;no<optionArray.length;no++){
                              optionArray[no].style.width = optionDiv.style.width.replace('px','') - 22 + 'px';       
                        }      
                  }            
                  optionDiv.style.display='none';
                  optionDiv.style.visibility='visible';
            }
            
            selectBoxIds = selectBoxIds + 1;
      }      
      
      </script>
</head>
<body>
<form>
<p>This widget uses javascript to transform this:</p>
<table border="0">
      <tr>
            <td>Where do you come from?</td>
            <td><input type="text" name="myText_ex" value="Norway" selectBoxOptions="Canada;Denmark;Finland;Germany;Mexico;Norway;Sweden;United Kingdom;United States"></td>
      </tr>
      <tr>
            <td>What is your name?</td>
            <td><input type="text" name="myText_ex2" value="" selectBoxOptions="Amy;Andrew;Carol;Jennifer;Jim;Tim;Tommy;Vince"></td>
      </tr>
</table>
<p>Into this:</p>
<table border="0">
      <tr>
            <td>Where do you come from?</td>
            <td><input type="text" name="myText" value="Norway" selectBoxOptions="Canada;Denmark;Finland;Germany;Mexico;Norway;Sweden;United Kingdom;United States"></td>
      </tr>
      <tr>
            <td>What is your name?</td>
            <td><input type="text" name="myText2" value="" selectBoxOptions="Amy;Andrew;Carol;Jennifer;Jim;Tim;Tommy;Vince"></td>
      </tr>
</table>
<p>I.e.: A combination of text- and selectbox. You can type in a value or choose from the list</p>
<p>The only thing you have to do to make this work is to add an attribute "selectBoxOptions" to one of your text inputs:<br><br>
&lt;input type="text" name="myText" value="Norway" selectBoxOptions="Canada;Denmark;Finland;Germany;Mexico;Norway;Sweden;United Kingdom;United States">
<br><br>
And then simply call a javascript function that creates the editable select box:<br><br>
&lt;script type="text/javascript"><br>
createEditableSelect(document.forms[0].myText);<br>
&lt;/script>
</form>

<script type="text/javascript">
createEditableSelect(document.forms[0].myText);
createEditableSelect(document.forms[0].myText2);
</script>
<!-- Kontera ContentLink™  -->
<SCRIPT LANGUAGE="JavaScript">
var dc_UnitID = 14;
var dc_PublisherID = 3695;
var dc_AdLinkColor = 'blue';
var dc_adprod='ADL';
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript" SRC="http://kona.kontera.com/javascript/lib/KonaLibInline.js"></SCRIPT>
<!-- Kontera ContentLink™  --></body>
</html>
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16894376


I would try putting the scripts after the end body tag....
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16894420


Sees to work fine for me in IE and FF ....what issue are you seeing?
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 6

Author Comment

by:davecestria
ID: 16894439
NOT WORKING*****************

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title><%=SiteTitle%></title>
<style type="text/css">
<!--
.style2 {
      font-family: Arial, Helvetica, sans-serif;
      font-weight: bold;
      font-size: 10px;
      color: #003B8C;
}
.style323 {color: #FFCC00;
      font-size: 9px;
      font-family: Arial, Helvetica, sans-serif;
}
.style7 {
      color: #FFFFFF;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 10px;
      font-weight: bold;
}
.style13 {color: #003B8C; font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; }
body,td,th {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 9pt;
      color: #003B8C;
}
body {
      margin-left: 0px;
      margin-top: 0px;
      margin-right: 0px;
      margin-bottom: 0px;
}
a:link {
      color: #003B8C;
}
.style15 {color: #FFFFFF; font-size: 10px; }
}
-->
</style>
      <style type="text/css">
      html{
            width:100%;
             /* overflow-x:hidden; */
      }
      #mainContainer{
            width:99%;
            margin:0 auto;
            text-align:left;
            background-color:#FFF;
      }
      #dragableElementsParentBox{
            padding:0px;      /* Air */
      }
      .smallArticle,.bigArticle{
            float:left;
            border:1px solid #000;
            background-color:#DDD;
            padding:2px;
            margin-right:2px;
            margin-bottom:2px;
      }
      .smallArticle img,.bigArticle img{
            float:left;
            padding:2px;
      }
      .smallArticle .rightImage,.bigArticle .rightImage{
            float:right;
      }
      .bigArticle{
            width:100%;
      }
      .clear{
            clear:both;
      }
      #rectangle{
            float:left;
            border:1px dotted #F00;      /* Red border */
            background-color:#FFF;
      }
      #insertionMarker{      /* Don't change the rules for the insertionMarker */
            width:6px;
            position:absolute;
            display:none;
      }
      #insertionMarker img{      /* Don't change the rules for the insertionMarker */
            float:left;
      }            
      #dragDropMoveLayer{      /* Dragable layer - Not need if you're using 'rectangle' mode */
            position:absolute;
            display:none;
            border:1px solid #000;
            filter:alpha(opacity=40);      /* 50% opacity , i.e. transparency */
            opacity:0.4 ;      /* 50% opacity , i.e. transparency */

      }
      /* START SELECT TEXT BOX STYLES */
      .selectBoxArrow{
            margin-top:1px;
            float:left;
            position:absolute;
            right:1px;
            

      }      
      .selectBoxInput{
            border:0px;
            padding-left:1px;
            height:16px;
            position:absolute;
            top:0px;
            left:0px;
      }

      .selectBox{
            border:1px solid #7f9db9;
            height:20px;      
      
      }
      .selectBoxOptionContainer{
            position:absolute;
            border:1px solid #7f9db9;
            height:100px;
            background-color:#FFF;
            left:-1px;
            top:20px;
            visibility:hidden;
            overflow:auto;
      }
      .selectBoxAnOption{
            font-family:arial;
            font-size:12px;
            cursor:default;
            margin:1px;
            overflow:hidden;
            white-space:nowrap;
      }
      .style16 {font-size: 8pt}
.style17 {      color: #FFFFFF;
      font-weight: bold;
}
</style>
<script src="../../content/js/MoveRows.js"></script>
<script type="text/javascript">
      window.onload = initdragableElements;
</script>
      <script type="text/javascript">
      var arrowImage = '/lgcm/content/images/select_arrow.gif';      // Regular arrow
      var arrowImageOver = '/lgcm/content/images/select_arrow_over.gif';      // Mouse over
      var arrowImageDown = '/lgcm/content/images/select_arrow_down.gif';      // Mouse down

      
      var selectBoxIds = 0;
      var currentlyOpenedOptionBox = false;
      var editableSelect_activeArrow = false;
      

      
      function selectBox_switchImageUrl()
      {
            if(this.src.indexOf(arrowImage)>=0){
                  this.src = this.src.replace(arrowImage,arrowImageOver);      
            }else{
                  this.src = this.src.replace(arrowImageOver,arrowImage);
            }
            
            
      }
      
      function selectBox_showOptions()
      {
            if(editableSelect_activeArrow && editableSelect_activeArrow!=this){
                  editableSelect_activeArrow.src = arrowImage;
                  
            }
            editableSelect_activeArrow = this;
            var optionDiv = document.getElementById('selectBoxOptions' + this.id.replace(/[^\d]/g,''));
            if(optionDiv.style.display=='block'){
                  optionDiv.style.display='none';
                  this.src = arrowImageOver;      
            }else{                  
                  optionDiv.style.display='block';
                  this.src = arrowImageDown;      
                  if(currentlyOpenedOptionBox && currentlyOpenedOptionBox!=optionDiv)currentlyOpenedOptionBox.style.display='none';      
                  currentlyOpenedOptionBox= optionDiv;                  
            }
      }
      
      function selectOptionValue()
      {
            var parentNode = this.parentNode.parentNode;
            var textInput = parentNode.getElementsByTagName('INPUT')[0];
            textInput.value = this.innerHTML;      
            this.parentNode.style.display='none';      
            document.getElementById('arrowSelectBox' + parentNode.id.replace(/[^\d]/g,'')).src = arrowImageOver;
      }
      var activeOption;
      function highlightSelectBoxOption()
      {
            if(this.style.backgroundColor=='#316AC5'){
                  this.style.backgroundColor='';
                  this.style.color='';
            }else{
                  this.style.backgroundColor='#316AC5';
                  this.style.color='#FFF';                  
            }      
            
            if(activeOption){
                  activeOption.style.backgroundColor='';
                  activeOption.style.color='';                  
            }
            activeOption = this;
            
      }
      
      function createEditableSelect(dest)
      {

            dest.className='selectBoxInput';            
            var div = document.createElement('DIV');
            div.style.styleFloat = 'left';
            div.style.width = dest.offsetWidth + 16 + 'px';
            div.style.position = 'relative';
            div.id = 'selectBox' + selectBoxIds;
            var parent = dest.parentNode;
            parent.insertBefore(div,dest);
            div.appendChild(dest);      
            div.className='selectBox';
            div.style.zIndex = 10000 - selectBoxIds;

            var img = document.createElement('IMG');
            img.src = arrowImage;
            img.className = 'selectBoxArrow';
            
            img.onmouseover = selectBox_switchImageUrl;
            img.onmouseout = selectBox_switchImageUrl;
            img.onclick = selectBox_showOptions;
            img.id = 'arrowSelectBox' + selectBoxIds;

            div.appendChild(img);
            
            var optionDiv = document.createElement('DIV');
            optionDiv.id = 'selectBoxOptions' + selectBoxIds;
            optionDiv.className='selectBoxOptionContainer';
            optionDiv.style.width = div.offsetWidth-2 + 'px';
            div.appendChild(optionDiv);
            
            if(dest.getAttribute('selectBoxOptions')){
                  var options = dest.getAttribute('selectBoxOptions').split(';');
                  var optionsTotalHeight = 0;
                  var optionArray = new Array();
                  for(var no=0;no<options.length;no++){
                        var anOption = document.createElement('DIV');
                        anOption.innerHTML = options[no];
                        anOption.className='selectBoxAnOption';
                        anOption.onclick = selectOptionValue;
                        anOption.style.width = optionDiv.style.width.replace('px','') - 2 + 'px';
                        anOption.onmouseover = highlightSelectBoxOption;
                        optionDiv.appendChild(anOption);      
                        optionsTotalHeight = optionsTotalHeight + anOption.offsetHeight;
                        optionArray.push(anOption);
                  }
                  if(optionsTotalHeight > optionDiv.offsetHeight){                        
                        for(var no=0;no<optionArray.length;no++){
                              optionArray[no].style.width = optionDiv.style.width.replace('px','') - 22 + 'px';       
                        }      
                  }            
                  optionDiv.style.display='none';
                  optionDiv.style.visibility='visible';
            }
            
            selectBoxIds = selectBoxIds + 1;
      }      
      
      </script>
</head>
<body>
<!--#include file="../../global/header.asp"-->
<table width="100%"  border="0" cellspacing="0" cellpadding="2">
  <tr valign="top">
    <td width="15%"><!--#include file="../../global/menu_left.asp"--></td>
    <td width="85%">
      <table width="98%"  border="0" align="center" cellpadding="2" cellspacing="0">
      <tr>
        <td valign="top"><!--#include file="../../global/menu_top.asp"-->
<br></td>
      </tr>
      <tr>
        <td valign="top"><table width="97%"  border="0" align="center" cellpadding="2" cellspacing="0">
          <tr>
            <td width="20%" bgcolor="#003B8C" class="style7"><%=RunName%> - Details. </td>
            <td width="80%"><div align="right">Print Driver Runsheet | Debrief | Delete </div></td>
          </tr>
        </table>
          <table width="97%"  border="1" align="center" cellpadding="2" cellspacing="0" bordercolor="#003B8C">
            <tr>
              <th height="21" valign="top" bordercolor="#FFFFFF" background="../../content/images/body_bg.png"><form action="default.asp?action=changeorder&uid=<%=Request.QueryString("uid")%>" method="POST" name="Moveable" id="Moveable">
                <div align="left">
                  <div id="mainContainer" width="100%">
                    <!-- START DRAGABLE CONTENT -->
                    <div id="dragableElementsParentBox">
                      <%
                                totalCube = 0.000
                          do while not CDrsC.EOF
                          totalCube = totalCube + FormatNumber(CDrsC("CustomerCube"),3)
                          %>
                      <div class="bigArticle" dragablebox="true" id="Customer<%=CDrsC("CustomerID")%>">
                        <table width="97%"  border="0" cellspacing="0" cellpadding="2">
                          <tr>
                            <td width="6%"><img src="../../content/images/move_up-down.png" alt="Click + Hold to Move" width="18" height="24"></td>
                            <td width="18%"><strong><%=CDrsC("CustomerName")%>
</strong></td>
                            <td width="11%"><strong><%=CDrsC("CustomerPostcode")%></strong></td>
                            <td width="15%"><strong><%=CDrsC("CustomerSAC")%></strong></td>
                            <td width="10%"><strong><%=CDrsC("CustomerCube")%></strong></td>
                            <td width="10%"><strong><%=CDrsC("CustomerDate")%></strong></td>
                            <td width="10%"><strong><%=CDrsC("CustomerStatus")%></strong></td>
                            <td width="20%"><strong><a href="/lgcm/customers/view/default.asp?customer=<%=CDrsC("CustomerID")%>&now=<%=Now()%>">View</a> | <a href="/lgcm/customers/modify/default.asp?customer=<%=CDrsC("CustomerID")%>&now=<%=Now()%>">Modify</a> | <a href="runs/view/default.asp?action=removesingle&customer=<%=CDrsC("CustomerID")%>" onClick="return confirm('Are You Sure You Want To Remove This Customer From <%=RunName%>?');">Remove</a>
                              <input name="CustID" type="hidden" id="CustID" value="<%=CDrsC("CustomerID")%>">
                            </strong></td>
                          </tr>
                        </table>
                      </div>
                      <%
                              strPCList = strPCList & CDrsC("CustomerPostcode") & "|"
                              CDrsC.MoveNext
                              LOOP
                              %>
                      <div class="clear" id="clear"></div>
                    </div>
                    <!-- END DRAGABLE CONTENT -->
                    <div align="center">
                      <input name="itemOrder" type="hidden" id="itemOrder" value="">
                      <input name="action" type="hidden" id="action" value="changeorder">
                      <input name="uid" type="hidden" id="uid" value="<%=Request.QueryString("uid")%>">
                      <input type="submit" value="Save Run Order">
                      <br>                
                        </div>
                  </div>
                  <!-- REQUIRED DIVS -->
                  <div id="insertionMarker"> <img src="images/marker_top.gif"> <img src="images/marker_middle.gif" id="insertionMarkerLine"> <img src="images/marker_bottom.gif"> </div>
                  <!-- END REQUIRED DIVS -->
                </div>
                        </form>
                    <%
'                                arrPostcodes = Split("DH3+2RZ|" & strPCList & "DH3+2RZ","|")
'                              totalHours = 0
'                              totalMins = 0
'                              totalMiles = 0.00
                              
'                              for MMPC = 0 to UBound(arrPostcodes)-1
'                                    arrThisTrip = Split(GetMultiMapInfo(arrPostcodes(MMPC),arrPostcodes(MMPC+1)),"|")
'                                    totalHours = totalHours + arrThisTrip(0)
'                                    totalMins = totalMins + arrThisTrip(1)
'                                    totalMiles = totalMiles + arrThisTrip(2)
                                    'Response.Write arrPostcodes(MMPC) & " to " & arrPostcodes(MMPC+1) & ", Hours: " & arrThisTrip(0) & ", Mins: " & arrThisTrip(1)
                                    'Response.Write ", Miles: " & FormatNumber(arrThisTrip(2),1) & "<br>"
'                              next
                              
'                              totalHours = (totalHours * 60) + totalMins
'                              totalHours = FormatNumber(totalHours / 60,2)
'                              tmpTH = Split(totalHours,".")
'                              totalHours = tmpTH(0)
'                              totalMins = Int(tmpTH(1) * 0.6)
                    %>
              <br>
              <form action="default.asp?action=save&uid=<%=Request.QueryString("uid")%>" method="post">
                      <table width="97%"  border="0" cellspacing="0" cellpadding="2">
                  <tr>
                    <td bgcolor="#003B8C"><div align="left" class="style17">Run Details </div></td>
                    <td>&nbsp;</td>
                    <td bgcolor="#003B8C"><div align="left" class="style17">Run Stats</div></td>
                    <td>&nbsp;</td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Vehicle</strong></div></td>
                    <td><div align="left">
                      <input name="textfield" type="text" value="<%=CDrs("RunVehicle")%>" size="20">
                    </div></td>
                    <td><div align="left">Total Cube </div></td>
                    <td><div align="left"><%=FormatNumber(totalCube,3)%></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td width="15%"><div align="left"><strong> Name </strong></div></td>
                    <td width="35%"><div align="left">
                      <input name="textfield" type="text" value="<%=CDrs("RunName")%>" size="16">
                    </div></td>
                    <td width="15%"><div align="left"><strong>Total Drops </strong></div></td>
                    <td width="35%"><div align="left"><%=CDrsC.RecordCount%></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                    </tr>
                  <tr>
                    <td><div align="left"><strong> Date </strong></div></td>
                    <td><div align="left"><%=CDrs("RunDate")%></div></td>
                    <td><p align="left"><strong>Est Distance</strong></p>
                      </td>
                    <td><div align="left"><%=FormatNumber(totalMiles,1)%> <span class="style16">Miles,</span> <%=FormatNumber(totalMiles*1.609,1)%> <span class="style16">Kilometers. </span></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>ID </strong></div></td>
                    <td><div align="left"><%=CDrs("RunUniqueID")%></div></td>
                    <td><div align="left"><strong>Est  Time</strong></div></td>
                    <td><div align="left"><%=totalHours%> <span class="style16">Hours,</span> <%=totalMins%> <span class="style16">Minutes. </span></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Contract </strong></div></td>
                    <td><div align="left">
                      <select name="select">
                          <option value="Homebase Kitchens">Homebase Kitchens</option>
                          <option value="White Goods">White Goods</option>
                      </select>
                    </div></td>
                    <td><div align="left"><strong>Est Cost </strong></div></td>
                    <td>
                                <div align="left">
                                    <%
                              estCost = 0
                              estCost = estCost + 45 'Rental
                              estCost = estCost + 6.50 'Insurance
                              estCost = estCost + (totalMiles / 30) * 3.75 'Fuel
                              estCost = estCost + (totalHours * 5.70) * 2 'Wages (Hours)
                              if totalMins >= 45 then
                                    estCost = estCost + (0.75 * 5.70) * 2
                              end if
                              if totalMins < 44.9 and totalMins > 30 then
                                    estCost = estCost + (0.50 * 5.70) * 2
                              end if
                              if totalMins <= 30 and totalMins >= 15 then
                                    estCost = estCost + (0.25 * 5.70) * 2
                              end if
                              Response.Write "£" & FormatNumber(estCost,2)
                              %>
                                  </div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong> Driver </strong></div></td>
                    <td align="left">
                      <input type="text" name="Driver" value="" selectBoxOptions="Dave Gibson1;Kevin Mines1;Chris Mines1">
                    </td>
                    <td><div align="left"><strong>Status</strong></div></td>
                    <td><div align="left"><%=SafeRep(CDrs("RunStatus"),"","")%></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong> Mate </strong></div></td>
                    <td><div align="left">
                      <input type="text" name="Mate" value="" selectBoxOptions="Dave Gibson;Kevin Mines;Chris Mines">
                    </div></td>
                    <td><div align="left"><strong>Actual Distance </strong></div></td>
                    <td><div align="left">
                      <input name="textfield" type="text" size="6" value="<%if CDrs("RunMiles") <> "" or CDrs("RunMiles") <> 0 then Response.Write FormatNumber(CDrs("RunMiles"),1) else Response.Write "0.0" end if%>">
                        <span class="style16">(miles) </span></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Contact</strong></div></td>
                    <td><div align="left">
                      <input name="textfield" type="text" value="<%=CDrs("RunContact")%>" size="20">
                    </div></td>
                    <td><div align="left"><strong>Actual Time </strong></div></td>
                    <td><div align="left"><span class="style16">
                        <input name="textfield" type="text" size="2" value="<%if CDrs("RunTotalTimeH") <> "" or CDrs("RunTotalTimeH") <> 0 then Response.Write CDrs("RunTotalTimeH") else Response.Write "0" end if%>">
                        hours,
                          <input name="textfield" type="text" size="2" value="<%if CDrs("RunTotalTimeM") <> "" or CDrs("RunTotalTimeM") <> 0 then Response.Write CDrs("RunTotalTimeM") else Response.Write "0" end if%>">
                        minutes.</span></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Start Time </strong></div></td>
                    <td><div align="left">
                      <select name="Start" id="Start">
                          <option value=""<%if CDrs("RunStartTime") = "" or ISNull(CDrs("RunStartTime")) then%> selected<%end if%>>Time</option>
                          <option value="00:00"<%if CDrs("RunStartTime") = "00:00" then%> selected<%end if%>>00:00</option>
                          <option value="00:15"<%if CDrs("RunStartTime") = "00:15" then%> selected<%end if%>>00:15</option>
                          <option value="00:30"<%if CDrs("RunStartTime") = "00:30" then%> selected<%end if%>>00:30</option>
                          <option value="00:45"<%if CDrs("RunStartTime") = "00:45" then%> selected<%end if%>>00:45</option>
                          <option value="01:00"<%if CDrs("RunStartTime") = "01:00" then%> selected<%end if%>>01:00</option>
                          <option value="01:15"<%if CDrs("RunStartTime") = "01:15" then%> selected<%end if%>>01:15</option>
                          <option value="01:30"<%if CDrs("RunStartTime") = "01:30" then%> selected<%end if%>>01:30</option>
                          <option value="01:45"<%if CDrs("RunStartTime") = "01:45" then%> selected<%end if%>>01:45</option>
                          <option value="02:00"<%if CDrs("RunStartTime") = "02:00" then%> selected<%end if%>>02:00</option>
                          <option value="02:15"<%if CDrs("RunStartTime") = "02:15" then%> selected<%end if%>>02:15</option>
                          <option value="02:30"<%if CDrs("RunStartTime") = "02:30" then%> selected<%end if%>>02:30</option>
                          <option value="02:45"<%if CDrs("RunStartTime") = "02:45" then%> selected<%end if%>>02:45</option>
                          <option value="03:00"<%if CDrs("RunStartTime") = "03:00" then%> selected<%end if%>>03:00</option>
                          <option value="03:15"<%if CDrs("RunStartTime") = "03:15" then%> selected<%end if%>>03:15</option>
                          <option value="03:30"<%if CDrs("RunStartTime") = "03:30" then%> selected<%end if%>>03:30</option>
                          <option value="03:45"<%if CDrs("RunStartTime") = "03:45" then%> selected<%end if%>>03:45</option>
                          <option value="04:00"<%if CDrs("RunStartTime") = "04:00" then%> selected<%end if%>>04:00</option>
                          <option value="04:15"<%if CDrs("RunStartTime") = "04:15" then%> selected<%end if%>>04:15</option>
                          <option value="04:30"<%if CDrs("RunStartTime") = "04:30" then%> selected<%end if%>>04:30</option>
                          <option value="04:45"<%if CDrs("RunStartTime") = "04:45" then%> selected<%end if%>>04:45</option>
                          <option value="05:00"<%if CDrs("RunStartTime") = "05:00" then%> selected<%end if%>>05:00</option>
                          <option value="05:15"<%if CDrs("RunStartTime") = "05:15" then%> selected<%end if%>>05:15</option>
                          <option value="05:30"<%if CDrs("RunStartTime") = "05:30" then%> selected<%end if%>>05:30</option>
                          <option value="05:45"<%if CDrs("RunStartTime") = "05:45" then%> selected<%end if%>>05:45</option>
                          <option value="06:00"<%if CDrs("RunStartTime") = "06:00" then%> selected<%end if%>>06:00</option>
                          <option value="06:15"<%if CDrs("RunStartTime") = "06:15" then%> selected<%end if%>>06:15</option>
                          <option value="06:30"<%if CDrs("RunStartTime") = "06:30" then%> selected<%end if%>>06:30</option>
                          <option value="06:45"<%if CDrs("RunStartTime") = "06:45" then%> selected<%end if%>>06:45</option>
                          <option value="07:00"<%if CDrs("RunStartTime") = "07:00" then%> selected<%end if%>>07:00</option>
                          <option value="07:15"<%if CDrs("RunStartTime") = "07:15" then%> selected<%end if%>>07:15</option>
                          <option value="07:30"<%if CDrs("RunStartTime") = "07:30" then%> selected<%end if%>>07:30</option>
                          <option value="07:45"<%if CDrs("RunStartTime") = "07:45" then%> selected<%end if%>>07:45</option>
                          <option value="08:00"<%if CDrs("RunStartTime") = "08:00" then%> selected<%end if%>>08:00</option>
                          <option value="08:15"<%if CDrs("RunStartTime") = "08:15" then%> selected<%end if%>>08:15</option>
                          <option value="08:30"<%if CDrs("RunStartTime") = "08:30" then%> selected<%end if%>>08:30</option>
                          <option value="08:45"<%if CDrs("RunStartTime") = "08:45" then%> selected<%end if%>>08:45</option>
                          <option value="09:00"<%if CDrs("RunStartTime") = "09:00" then%> selected<%end if%>>09:00</option>
                          <option value="09:15"<%if CDrs("RunStartTime") = "09:15" then%> selected<%end if%>>09:15</option>
                          <option value="09:30"<%if CDrs("RunStartTime") = "09:30" then%> selected<%end if%>>09:30</option>
                          <option value="09:45"<%if CDrs("RunStartTime") = "09:45" then%> selected<%end if%>>09:45</option>
                          <option value="10:00"<%if CDrs("RunStartTime") = "10:00" then%> selected<%end if%>>10:00</option>
                          <option value="10:15"<%if CDrs("RunStartTime") = "10:15" then%> selected<%end if%>>10:15</option>
                          <option value="10:30"<%if CDrs("RunStartTime") = "10:30" then%> selected<%end if%>>10:30</option>
                          <option value="10:45"<%if CDrs("RunStartTime") = "10:45" then%> selected<%end if%>>10:45</option>
                          <option value="11:00"<%if CDrs("RunStartTime") = "11:00" then%> selected<%end if%>>11:00</option>
                          <option value="11:15"<%if CDrs("RunStartTime") = "11:15" then%> selected<%end if%>>11:15</option>
                          <option value="11:30"<%if CDrs("RunStartTime") = "11:30" then%> selected<%end if%>>11:30</option>
                          <option value="11:45"<%if CDrs("RunStartTime") = "11:45" then%> selected<%end if%>>11:45</option>
                          <option value="12:00"<%if CDrs("RunStartTime") = "12:00" then%> selected<%end if%>>12:00</option>
                          <option value="12:15"<%if CDrs("RunStartTime") = "12:15" then%> selected<%end if%>>12:15</option>
                          <option value="12:30"<%if CDrs("RunStartTime") = "12:30" then%> selected<%end if%>>12:30</option>
                          <option value="12:45"<%if CDrs("RunStartTime") = "12:45" then%> selected<%end if%>>12:45</option>
                          <option value="13:00"<%if CDrs("RunStartTime") = "13:00" then%> selected<%end if%>>13:00</option>
                          <option value="13:15"<%if CDrs("RunStartTime") = "13:15" then%> selected<%end if%>>13:15</option>
                          <option value="13:30"<%if CDrs("RunStartTime") = "13:30" then%> selected<%end if%>>13:30</option>
                          <option value="13:45"<%if CDrs("RunStartTime") = "13:45" then%> selected<%end if%>>13:45</option>
                          <option value="14:00"<%if CDrs("RunStartTime") = "14:00" then%> selected<%end if%>>14:00</option>
                          <option value="14:15"<%if CDrs("RunStartTime") = "14:15" then%> selected<%end if%>>14:15</option>
                          <option value="14:30"<%if CDrs("RunStartTime") = "14:30" then%> selected<%end if%>>14:30</option>
                          <option value="14:45"<%if CDrs("RunStartTime") = "14:45" then%> selected<%end if%>>14:45</option>
                          <option value="15:00"<%if CDrs("RunStartTime") = "15:00" then%> selected<%end if%>>15:00</option>
                          <option value="15:15"<%if CDrs("RunStartTime") = "15:15" then%> selected<%end if%>>15:15</option>
                          <option value="15:30"<%if CDrs("RunStartTime") = "15:30" then%> selected<%end if%>>15:30</option>
                          <option value="15:45"<%if CDrs("RunStartTime") = "15:45" then%> selected<%end if%>>15:45</option>
                          <option value="16:00"<%if CDrs("RunStartTime") = "16:00" then%> selected<%end if%>>16:00</option>
                          <option value="16:15"<%if CDrs("RunStartTime") = "16:15" then%> selected<%end if%>>16:15</option>
                          <option value="16:30"<%if CDrs("RunStartTime") = "16:30" then%> selected<%end if%>>16:30</option>
                          <option value="16:45"<%if CDrs("RunStartTime") = "16:45" then%> selected<%end if%>>16:45</option>
                          <option value="17:00"<%if CDrs("RunStartTime") = "17:00" then%> selected<%end if%>>17:00</option>
                          <option value="17:15"<%if CDrs("RunStartTime") = "17:15" then%> selected<%end if%>>17:15</option>
                          <option value="17:30"<%if CDrs("RunStartTime") = "17:30" then%> selected<%end if%>>17:30</option>
                          <option value="17:45"<%if CDrs("RunStartTime") = "17:45" then%> selected<%end if%>>17:45</option>
                          <option value="18:00"<%if CDrs("RunStartTime") = "18:00" then%> selected<%end if%>>18:00</option>
                          <option value="18:15"<%if CDrs("RunStartTime") = "18:15" then%> selected<%end if%>>18:15</option>
                          <option value="18:30"<%if CDrs("RunStartTime") = "18:30" then%> selected<%end if%>>18:30</option>
                          <option value="18:45"<%if CDrs("RunStartTime") = "18:45" then%> selected<%end if%>>18:45</option>
                          <option value="19:00"<%if CDrs("RunStartTime") = "19:00" then%> selected<%end if%>>19:00</option>
                          <option value="19:15"<%if CDrs("RunStartTime") = "19:15" then%> selected<%end if%>>19:15</option>
                          <option value="19:30"<%if CDrs("RunStartTime") = "19:30" then%> selected<%end if%>>19:30</option>
                          <option value="19:45"<%if CDrs("RunStartTime") = "19:45" then%> selected<%end if%>>19:45</option>
                          <option value="20:00"<%if CDrs("RunStartTime") = "20:00" then%> selected<%end if%>>20:00</option>
                          <option value="20:15"<%if CDrs("RunStartTime") = "20:15" then%> selected<%end if%>>20:15</option>
                          <option value="20:30"<%if CDrs("RunStartTime") = "20:30" then%> selected<%end if%>>20:30</option>
                          <option value="20:45"<%if CDrs("RunStartTime") = "20:45" then%> selected<%end if%>>20:45</option>
                          <option value="21:00"<%if CDrs("RunStartTime") = "21:00" then%> selected<%end if%>>21:00</option>
                          <option value="21:15"<%if CDrs("RunStartTime") = "21:15" then%> selected<%end if%>>21:15</option>
                          <option value="21:30"<%if CDrs("RunStartTime") = "21:30" then%> selected<%end if%>>21:30</option>
                          <option value="21:45"<%if CDrs("RunStartTime") = "21:45" then%> selected<%end if%>>21:45</option>
                          <option value="22:00"<%if CDrs("RunStartTime") = "22:00" then%> selected<%end if%>>22:00</option>
                          <option value="22:15"<%if CDrs("RunStartTime") = "22:15" then%> selected<%end if%>>22:15</option>
                          <option value="22:30"<%if CDrs("RunStartTime") = "22:30" then%> selected<%end if%>>22:30</option>
                          <option value="22:45"<%if CDrs("RunStartTime") = "22:45" then%> selected<%end if%>>22:45</option>
                          <option value="23:00"<%if CDrs("RunStartTime") = "23:00" then%> selected<%end if%>>23:00</option>
                          <option value="23:15"<%if CDrs("RunStartTime") = "23:15" then%> selected<%end if%>>23:15</option>
                          <option value="23:30"<%if CDrs("RunStartTime") = "23:30" then%> selected<%end if%>>23:30</option>
                          <option value="23:45"<%if CDrs("RunStartTime") = "23:45" then%> selected<%end if%>>23:45</option>
                      </select>
                    </div></td>
                    <td><div align="left"><strong>Actual Income </strong></div></td>
                    <td><div align="left"><span class="style16">&pound;</span>                          <input name="textfield" type="text" value="<%if CDrs("RunIncome") <> "" or CDrs("RunIncome") <> 0 then Response.Write FormatNumber(CDrs("RunIncome"),2) else Response.Write "0.00" end if%>" size="6">
                    </div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Finish Time </strong></div></td>
                    <td><div align="left"><%=safeRep(CDrs("RunFinishTime"),"","")%></div></td>
                    <td><div align="left">Actual Cost </div></td>
                    <td><div align="left"><span class="style16">&pound;</span>
                          <input name="textfield" type="text" size="6" value="<%if CDrs("RunCost") <> "" or CDrs("RunCost") <> 0 then Response.Write FormatNumber(CDrs("RunCost"),2) else Response.Write "0.00" end if%>">
                    </div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Comments</strong></div></td>
                    <td><div align="left">
                      <input name="textfield" type="text" value="<%=CDrs("RunComments")%>" size="20">
                    </div></td>
                    <td><div align="left"><strong>Profit / Loss </strong></div></td>
                    <td><div align="left"><%if CDrs("RunIncome") <> "" and ISNumeric(CDrs("RunIncome")) and CDrs("RunCost") <> "" and ISNumeric(CDrs("RunCost")) then%><%="£" & FormatNumber(CDrs("RunIncome")-CDrs("RunCost"),2)%><%else%><%="£<font color='red'>0.00</font> - <font size=1>Figures Required To Calculate</font>"%><%end if%></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"></div></td>
                    <td><div align="left">
                    </div></td>
                    <td><div align="left"></div></td>
                    <td><div align="left"></div></td>
                  </tr>
                  <tr>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                  </tr>
                  <tr>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                  </tr>
                </table>
              </form>
                    <script type="text/javascript">
                        createEditableSelect(document.forms[1].Driver);
                        createEditableSelect(document.forms[1].Mate);
                    </script>

                    </th>
            </tr>
          </table></td>
      </tr>
    </table></td>
  </tr>
</table>
<br>
<!--#include file="../../global/footer.asp"-->
</body>
</html>
0
 
LVL 6

Author Comment

by:davecestria
ID: 16894454
Thanks for your comments, but i know that code is working fine, its when i try to use it in my normal page it fails. I will upload it so you can see what i mean.

Give me a minute
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16894505
       
The driver and Mate input seem to be in form[2] not forms[1]

        <script type="text/javascript">
                    createEditableSelect(document.forms[1].Driver);
                    createEditableSelect(document.forms[1].Mate);
                 </script>
0
 
LVL 6

Author Comment

by:davecestria
ID: 16894508
http://cestriadistribution.com/lgcm/run.asp?uid=285860076

If you scroll down the page you will see what i mean... where its got driver and mate there are problems.

I'm not all that familiar with Javascript :o( so have no idea how to fix it or whats going wrong coz i copied everything exactly how DHTMLGoodies told me too.
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16894527


You might want to try just givin your inputs an id and using that to reference them. Then it doesn't matter what form they are in.

<input id="driver" name="driver" ....>

  <script type="text/javascript">
                    createEditableSelect(document.getElementById("Driver"));
 
                 </script>
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16894555

They seem to be working fine here too:  What are they doing wrong?

http://cestriadistribution.com/lgcm/run.asp?uid=285860076 
0
 
LVL 6

Author Comment

by:davecestria
ID: 16894614
Are you looking at the right options? Driver and Mate?

They are not showing at all, just an arrow next to Driver and normal text field for Mate.

I tried using GetElementById but that didnt work either.
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16894664

I see the problem is only in IE.. works fine in FF.  
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16894735

Working for me in IE now.. I just moved the script after the body tag... did you try that?
0
 
LVL 10

Accepted Solution

by:
0h4crying0utloud earned 500 total points
ID: 16894784

I just verified that was what causing a problem in IE. seem to work find now in Both IE and FF.


.
.
.

</body>
                    <script type="text/javascript">
                        createEditableSelect(document.forms[1].Driver);
                        createEditableSelect(document.forms[1].Mate);
                    </script>

</html>
0
 
LVL 6

Author Comment

by:davecestria
ID: 16894815
I have tried that, its still not working, where abouts after the body tag did you move it too? i just moved it to the first line underneath. Its an internal application, we only use IE. Thanks.
0
 
LVL 6

Author Comment

by:davecestria
ID: 16894837
GENIUS :o) thank you sooo much, this has been rattling my brain all day lol.

I owe you a pint.
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16894846

I just paste the working code:  



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>LGCM - Cestria Distribution</title>
<style type="text/css">
<!--
.style2 {
      font-family: Arial, Helvetica, sans-serif;
      font-weight: bold;
      font-size: 10px;
      color: #003B8C;
}
.style323 {color: #FFCC00;
      font-size: 9px;
      font-family: Arial, Helvetica, sans-serif;
}
.style7 {
      color: #FFFFFF;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 10px;
      font-weight: bold;
}
.style13 {color: #003B8C; font-size: 11px; font-family: Arial, Helvetica, sans-serif; font-weight: bold; }
body,td,th {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 9pt;
      color: #003B8C;
}
body {
      margin-left: 0px;
      margin-top: 0px;
      margin-right: 0px;
      margin-bottom: 0px;
}
a:link {
      color: #003B8C;
}
.style15 {color: #FFFFFF; font-size: 10px; }
}
-->
</style>
      <style type="text/css">
      html{
            width:100%;
             /* overflow-x:hidden; */
      }
      #mainContainer{
            width:99%;
            margin:0 auto;
            text-align:left;
            background-color:#FFF;
      }
      #dragableElementsParentBox{
            padding:0px;      /* Air */
      }
      .smallArticle,.bigArticle{
            float:left;
            border:1px solid #000;
            background-color:#DDD;
            padding:2px;
            margin-right:2px;
            margin-bottom:2px;
      }
      .smallArticle img,.bigArticle img{
            float:left;
            padding:2px;
      }
      .smallArticle .rightImage,.bigArticle .rightImage{
            float:right;
      }
      .bigArticle{
            width:100%;
      }
      .clear{
            clear:both;
      }
      #rectangle{
            float:left;
            border:1px dotted #F00;      /* Red border */
            background-color:#FFF;
      }
      #insertionMarker{      /* Don't change the rules for the insertionMarker */
            width:6px;
            position:absolute;
            display:none;
      }
      #insertionMarker img{      /* Don't change the rules for the insertionMarker */
            float:left;
      }            
      #dragDropMoveLayer{      /* Dragable layer - Not need if you're using 'rectangle' mode */
            position:absolute;
            display:none;
            border:1px solid #000;
            filter:alpha(opacity=40);      /* 50% opacity , i.e. transparency */
            opacity:0.4 ;      /* 50% opacity , i.e. transparency */

      }
      /* START SELECT TEXT BOX STYLES */
      .selectBoxArrow{
            margin-top:1px;
            float:left;
            position:absolute;
            right:1px;
            

      }      
      .selectBoxInput{
            border:0px;
            padding-left:1px;
            height:16px;
            position:absolute;
            top:0px;
            left:0px;
      }

      .selectBox{
            border:1px solid #7f9db9;
            height:20px;      
      
      }
      .selectBoxOptionContainer{
            position:absolute;
            border:1px solid #7f9db9;
            height:100px;
            background-color:#FFF;
            left:-1px;
            top:20px;
            visibility:hidden;
            overflow:auto;
      }
      .selectBoxAnOption{
            font-family:arial;
            font-size:12px;
            cursor:default;
            margin:1px;
            overflow:hidden;
            white-space:nowrap;
      }
      .style16 {font-size: 8pt}
.style17 {      color: #FFFFFF;
      font-weight: bold;
}
</style>
<script src="content/js/MoveRows.js"></script>
<script type="text/javascript">
      window.onload = initdragableElements;
</script>
      <script type="text/javascript">
      var arrowImage = '/lgcm/content/images/select_arrow.gif';      // Regular arrow
      var arrowImageOver = '/lgcm/content/images/select_arrow_over.gif';      // Mouse over
      var arrowImageDown = '/lgcm/content/images/select_arrow_down.gif';      // Mouse down

      
      var selectBoxIds = 0;
      var currentlyOpenedOptionBox = false;
      var editableSelect_activeArrow = false;
      

      
      function selectBox_switchImageUrl()
      {
            if(this.src.indexOf(arrowImage)>=0){
                  this.src = this.src.replace(arrowImage,arrowImageOver);      
            }else{
                  this.src = this.src.replace(arrowImageOver,arrowImage);
            }
            
            
      }
      
      function selectBox_showOptions()
      {
            if(editableSelect_activeArrow && editableSelect_activeArrow!=this){
                  editableSelect_activeArrow.src = arrowImage;
                  
            }
            editableSelect_activeArrow = this;
            var optionDiv = document.getElementById('selectBoxOptions' + this.id.replace(/[^\d]/g,''));
            if(optionDiv.style.display=='block'){
                  optionDiv.style.display='none';
                  this.src = arrowImageOver;      
            }else{                  
                  optionDiv.style.display='block';
                  this.src = arrowImageDown;      
                  if(currentlyOpenedOptionBox && currentlyOpenedOptionBox!=optionDiv)currentlyOpenedOptionBox.style.display='none';      
                  currentlyOpenedOptionBox= optionDiv;                  
            }
      }
      
      function selectOptionValue()
      {
            var parentNode = this.parentNode.parentNode;
            var textInput = parentNode.getElementsByTagName('INPUT')[0];
            textInput.value = this.innerHTML;      
            this.parentNode.style.display='none';      
            document.getElementById('arrowSelectBox' + parentNode.id.replace(/[^\d]/g,'')).src = arrowImageOver;
      }
      var activeOption;
      function highlightSelectBoxOption()
      {
            if(this.style.backgroundColor=='#316AC5'){
                  this.style.backgroundColor='';
                  this.style.color='';
            }else{
                  this.style.backgroundColor='#316AC5';
                  this.style.color='#FFF';                  
            }      
            
            if(activeOption){
                  activeOption.style.backgroundColor='';
                  activeOption.style.color='';                  
            }
            activeOption = this;
            
      }
      
      function createEditableSelect(dest)
      {

            dest.className='selectBoxInput';            
            var div = document.createElement('DIV');
            div.style.styleFloat = 'left';
            div.style.width = dest.offsetWidth + 16 + 'px';
            div.style.position = 'relative';
            div.id = 'selectBox' + selectBoxIds;
            var parent = dest.parentNode;
            parent.insertBefore(div,dest);
            div.appendChild(dest);      
            div.className='selectBox';
            div.style.zIndex = 10000 - selectBoxIds;

            var img = document.createElement('IMG');
            img.src = arrowImage;
            img.className = 'selectBoxArrow';
            
            img.onmouseover = selectBox_switchImageUrl;
            img.onmouseout = selectBox_switchImageUrl;
            img.onclick = selectBox_showOptions;
            img.id = 'arrowSelectBox' + selectBoxIds;

            div.appendChild(img);
            
            var optionDiv = document.createElement('DIV');
            optionDiv.id = 'selectBoxOptions' + selectBoxIds;
            optionDiv.className='selectBoxOptionContainer';
            optionDiv.style.width = div.offsetWidth-2 + 'px';
            div.appendChild(optionDiv);
            
            if(dest.getAttribute('selectBoxOptions')){
                  var options = dest.getAttribute('selectBoxOptions').split(';');
                  var optionsTotalHeight = 0;
                  var optionArray = new Array();
                  for(var no=0;no<options.length;no++){
                        var anOption = document.createElement('DIV');
                        anOption.innerHTML = options[no];
                        anOption.className='selectBoxAnOption';
                        anOption.onclick = selectOptionValue;
                        anOption.style.width = optionDiv.style.width.replace('px','') - 2 + 'px';
                        anOption.onmouseover = highlightSelectBoxOption;
                        optionDiv.appendChild(anOption);      
                        optionsTotalHeight = optionsTotalHeight + anOption.offsetHeight;
                        optionArray.push(anOption);
                  }
                  if(optionsTotalHeight > optionDiv.offsetHeight){                        
                        for(var no=0;no<optionArray.length;no++){
                              optionArray[no].style.width = optionDiv.style.width.replace('px','') - 22 + 'px';       
                        }      
                  }            
                  optionDiv.style.display='none';
                  optionDiv.style.visibility='visible';
            }
            
            selectBoxIds = selectBoxIds + 1;
      }      
      
      </script>
</head>
<body>
<table width="100%"  border="0" cellspacing="0" cellpadding="5">
  <tr bgcolor="#003B8C">
    <td width="88%" valign="top"><div align="left" class="style323"> </div>
        <div align="right">
          <table width="100%"  border="0" cellspacing="0" cellpadding="2">
            <tr>
              <td><div align="left"><span class="style7">Cestria Distribution - Lane Group Plc, Contract Management.</span></div></td>
            </tr>
            <tr>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>&nbsp;</td>
            </tr>
          </table>
      </div></td>
    <td width="12%"><div align="right"><img src="/lgcm/content/images/lane_logo.png" width="109" height="65"></div></td>
  </tr>
  <tr bgcolor="#E60F11">
    <td height="6" colspan="2"></td>
  </tr>
  <tr bgcolor="#E6E6E6">
    <td height="6" colspan="2" bgcolor="#E6E6E6"><span class="style2">Statistics Will Show Here &gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt; </span></td>
  </tr>
  <tr bgcolor="#E60F11">
    <td height="3" colspan="2"></td>
  </tr>
</table>

<table width="100%"  border="0" cellspacing="0" cellpadding="2">
  <tr valign="top">
    <td width="15%"><div align="center"><img src="/lgcm/content/images/cestria_logo.png" width="124" height="110"><br>
 
</div>
<div align="center">
  <table width="100%"  border="0" cellspacing="0" cellpadding="0">
    <tr>
      <td bgcolor="#003B8C" align="left">&nbsp; <font color="#FFFFFF" size="1">USER: <b>Guest</b></font></td>
    </tr>
  </table>
  <br>
  <script language=JavaScript1.2 src="/lgcm/global/menu/apytmenu.js" type=text/javascript></script>
  <script language=JavaScript1.2 src="/lgcm/global/menu/txpmenu1.js" type=text/javascript></script>
</div>
</td>
    <td width="85%">
      <table width="98%"  border="0" align="center" cellpadding="2" cellspacing="0">
      <tr>
        <td valign="top"><table width="100%"  border="0" cellpadding="2" cellspacing="0">
      <tr valign="middle">
        <td width="14%"><div align="center" class="style13"><a href="/lgcm/runs/import/"><img src="/lgcm/content/images/icons/import.gif" width="60" height="60" border="0"></a><br>
          Import Runs</div></td>
        <td width="14%"><div align="center" class="style13"><a href="/lgcm/search/"><img src="/lgcm/content/images/icons/search.gif" width="60" height="60" border="0"></a><br>
          Search</div></td>
        <td width="14%"><div align="center" class="style13"><a href="/lgcm/stock/list/"><img src="/lgcm/content/images/icons/stock.gif" width="60" height="60" border="0"></a><br>
          Stock List </div></td>
        <td width="14%"><div align="center" class="style13"><a href="/lgcm/staff/hours/"><img src="/lgcm/content/images/icons/tachours.gif" width="60" height="60" border="0"></a><br>
           Hours </div></td>
        <td width="14%"><div align="center" class="style13"><a href="/lgcm/reports/"><img src="/lgcm/content/images/icons/reports.gif" width="60" height="60" border="0"></a><br>
          Reports</div></td>
        <td width="14%"><div align="center" class="style13"><a href="/lgcm/staff/"><img src="/lgcm/content/images/icons/users-contacts.gif" width="60" height="60" border="0"></a><br>
          Users / Staff </div></td>
        <td width="14%"><div align="center" class="style13"><a href="/lgcm/default.asp?action=logout"><img src="/lgcm/content/images/icons/secure.gif" width="60" height="60" border="0"></a><br>
          Logout</div></td>
      </tr>
    </table>

<br></td>
      </tr>
      <tr>
        <td valign="top"><table width="97%"  border="0" align="center" cellpadding="2" cellspacing="0">
          <tr>
            <td width="20%" bgcolor="#003B8C" class="style7">HB Cestria 16 - Details. </td>
            <td width="80%"><div align="right">Print Driver Runsheet | Debrief | Delete </div></td>
          </tr>
        </table>
          <table width="97%"  border="1" align="center" cellpadding="2" cellspacing="0" bordercolor="#003B8C">
            <tr>
              <th height="21" valign="top" bordercolor="#FFFFFF" background="content/images/body_bg.png"><form action="runs/view/default.asp?action=changeorder&uid=285860076" method="POST" name="Moveable" id="Moveable">
                <div align="left">
                  <div id="mainContainer" width="100%">
                    <!-- START DRAGABLE CONTENT -->
                    <div id="dragableElementsParentBox">
                     
                      <div class="bigArticle" dragablebox="true" id="Customer1013">
                        <table width="97%"  border="0" cellspacing="0" cellpadding="2">
                          <tr>
                            <td width="6%"><img src="content/images/move_up-down.png" alt="Click + Hold to Move" width="18" height="24"></td>
                            <td width="18%"><strong>Mr.Aylen
</strong></td>
                            <td width="11%"><strong>NR1 1HJ</strong></td>
                            <td width="15%"><strong>4504710353</strong></td>
                            <td width="10%"><strong>1.746</strong></td>
                            <td width="10%"><strong>01/06/2006</strong></td>
                            <td width="10%"><strong></strong></td>
                            <td width="20%"><strong><a href="/lgcm/customers/view/default.asp?customer=1013&now=13/06/2006 15:56:53">View</a> | <a href="/lgcm/customers/modify/default.asp?customer=1013&now=13/06/2006 15:56:53">Modify</a> | <a href="runs/view/runs/view/default.asp?action=removesingle&customer=1013" onClick="return confirm('Are You Sure You Want To Remove This Customer From HB Cestria 16?');">Remove</a>
                              <input name="CustID" type="hidden" id="CustID" value="1013">
                            </strong></td>
                          </tr>
                        </table>
                      </div>
                     
                      <div class="bigArticle" dragablebox="true" id="Customer1014">
                        <table width="97%"  border="0" cellspacing="0" cellpadding="2">
                          <tr>
                            <td width="6%"><img src="content/images/move_up-down.png" alt="Click + Hold to Move" width="18" height="24"></td>
                            <td width="18%"><strong>Mr.HAWES
</strong></td>
                            <td width="11%"><strong>NR4 6PQ</strong></td>
                            <td width="15%"><strong>4504763158</strong></td>
                            <td width="10%"><strong>1.827</strong></td>
                            <td width="10%"><strong>01/06/2006</strong></td>
                            <td width="10%"><strong></strong></td>
                            <td width="20%"><strong><a href="/lgcm/customers/view/default.asp?customer=1014&now=13/06/2006 15:56:53">View</a> | <a href="/lgcm/customers/modify/default.asp?customer=1014&now=13/06/2006 15:56:53">Modify</a> | <a href="runs/view/runs/view/default.asp?action=removesingle&customer=1014" onClick="return confirm('Are You Sure You Want To Remove This Customer From HB Cestria 16?');">Remove</a>
                              <input name="CustID" type="hidden" id="CustID" value="1014">
                            </strong></td>
                          </tr>
                        </table>
                      </div>
                     
                      <div class="bigArticle" dragablebox="true" id="Customer1015">
                        <table width="97%"  border="0" cellspacing="0" cellpadding="2">
                          <tr>
                            <td width="6%"><img src="content/images/move_up-down.png" alt="Click + Hold to Move" width="18" height="24"></td>
                            <td width="18%"><strong>Mr.JOHNSON
</strong></td>
                            <td width="11%"><strong>NR19 1AE</strong></td>
                            <td width="15%"><strong>4504713671</strong></td>
                            <td width="10%"><strong>0.966</strong></td>
                            <td width="10%"><strong>01/06/2006</strong></td>
                            <td width="10%"><strong></strong></td>
                            <td width="20%"><strong><a href="/lgcm/customers/view/default.asp?customer=1015&now=13/06/2006 15:56:54">View</a> | <a href="/lgcm/customers/modify/default.asp?customer=1015&now=13/06/2006 15:56:54">Modify</a> | <a href="runs/view/runs/view/default.asp?action=removesingle&customer=1015" onClick="return confirm('Are You Sure You Want To Remove This Customer From HB Cestria 16?');">Remove</a>
                              <input name="CustID" type="hidden" id="CustID" value="1015">
                            </strong></td>
                          </tr>
                        </table>
                      </div>
                     
                      <div class="bigArticle" dragablebox="true" id="Customer1016">
                        <table width="97%"  border="0" cellspacing="0" cellpadding="2">

                          <tr>
                            <td width="6%"><img src="content/images/move_up-down.png" alt="Click + Hold to Move" width="18" height="24"></td>
                            <td width="18%"><strong>Mr.HARDING
</strong></td>
                            <td width="11%"><strong>NR20 4DG</strong></td>
                            <td width="15%"><strong>4504293237</strong></td>
                            <td width="10%"><strong>3.099</strong></td>
                            <td width="10%"><strong>01/06/2006</strong></td>
                            <td width="10%"><strong></strong></td>
                            <td width="20%"><strong><a href="/lgcm/customers/view/default.asp?customer=1016&now=13/06/2006 15:56:54">View</a> | <a href="/lgcm/customers/modify/default.asp?customer=1016&now=13/06/2006 15:56:54">Modify</a> | <a href="runs/view/runs/view/default.asp?action=removesingle&customer=1016" onClick="return confirm('Are You Sure You Want To Remove This Customer From HB Cestria 16?');">Remove</a>
                              <input name="CustID" type="hidden" id="CustID" value="1016">
                            </strong></td>
                          </tr>
                        </table>
                      </div>
                     
                      <div class="clear" id="clear"></div>
                    </div>
                    <!-- END DRAGABLE CONTENT -->
                    <div align="center">
                      <input name="itemOrder" type="hidden" id="itemOrder" value="">
                      <input name="action" type="hidden" id="action" value="changeorder">
                      <input name="uid" type="hidden" id="uid" value="285860076">
                      <input type="submit" value="Save Run Order">
                      <br>                
                        </div>
                  </div>
                  <!-- REQUIRED DIVS -->
                  <div id="insertionMarker"> <img src="runs/view/images/marker_top.gif"> <img src="runs/view/images/marker_middle.gif" id="insertionMarkerLine"> <img src="runs/view/images/marker_bottom.gif"> </div>
                  <!-- END REQUIRED DIVS -->
                </div>
                        </form>
                    
              <br>
              <form action="runs/view/default.asp?action=save&uid=285860076" method="post">
                      <table width="97%"  border="0" cellspacing="0" cellpadding="2">
                  <tr>
                    <td bgcolor="#003B8C"><div align="left" class="style17">Run Details </div></td>
                    <td>&nbsp;</td>
                    <td bgcolor="#003B8C"><div align="left" class="style17">Run Stats</div></td>
                    <td>&nbsp;</td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Vehicle</strong></div></td>
                    <td><div align="left">
                      <input name="textfield" type="text" value="" size="20">
                    </div></td>
                    <td><div align="left">Total Cube </div></td>
                    <td><div align="left">7.638</div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td width="15%"><div align="left"><strong> Name </strong></div></td>
                    <td width="35%"><div align="left">
                      <input name="textfield" type="text" value="HB Cestria 16" size="16">
                    </div></td>
                    <td width="15%"><div align="left"><strong>Total Drops </strong></div></td>
                    <td width="35%"><div align="left">4</div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                    </tr>
                  <tr>
                    <td><div align="left"><strong> Date </strong></div></td>
                    <td><div align="left">02/06/2006</div></td>
                    <td><p align="left"><strong>Est Distance</strong></p>
                      </td>
                    <td><div align="left">0.0 <span class="style16">Miles,</span> 0.0 <span class="style16">Kilometers. </span></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>ID </strong></div></td>
                    <td><div align="left">285860076</div></td>
                    <td><div align="left"><strong>Est  Time</strong></div></td>
                    <td><div align="left"> <span class="style16">Hours,</span>  <span class="style16">Minutes. </span></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Contract </strong></div></td>
                    <td><div align="left">
                      <select name="select">
                          <option value="Homebase Kitchens">Homebase Kitchens</option>
                          <option value="White Goods">White Goods</option>
                      </select>
                    </div></td>
                    <td><div align="left"><strong>Est Cost </strong></div></td>
                    <td>
                                <div align="left">
                                    £51.50
                                  </div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong> Driver </strong></div></td>
                    <td align="left">
                      <input type="text" name="Driver" value="" selectBoxOptions="Dave Gibson1;Kevin Mines1;Chris Mines1">
                    </td>
                    <td><div align="left"><strong>Status</strong></div></td>
                    <td><div align="left">N/A</div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong> Mate </strong></div></td>
                    <td><div align="left">
                      <input type="text" name="Mate" value="" selectBoxOptions="Dave Gibson;Kevin Mines;Chris Mines">
                    </div></td>
                    <td><div align="left"><strong>Actual Distance </strong></div></td>
                    <td><div align="left">
                      <input name="textfield" type="text" size="6" value="0.0">
                        <span class="style16">(miles) </span></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Contact</strong></div></td>
                    <td><div align="left">
                      <input name="textfield" type="text" value="" size="20">
                    </div></td>
                    <td><div align="left"><strong>Actual Time </strong></div></td>
                    <td><div align="left"><span class="style16">
                        <input name="textfield" type="text" size="2" value="0">
                        hours,
                          <input name="textfield" type="text" size="2" value="0">
                        minutes.</span></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Start Time </strong></div></td>
                    <td><div align="left">
                      <select name="Start" id="Start">
                          <option value="" selected>Time</option>
                          <option value="00:00">00:00</option>
                          <option value="00:15">00:15</option>
                          <option value="00:30">00:30</option>
                          <option value="00:45">00:45</option>
                          <option value="01:00">01:00</option>
                          <option value="01:15">01:15</option>
                          <option value="01:30">01:30</option>
                          <option value="01:45">01:45</option>
                          <option value="02:00">02:00</option>
                          <option value="02:15">02:15</option>
                          <option value="02:30">02:30</option>
                          <option value="02:45">02:45</option>
                          <option value="03:00">03:00</option>
                          <option value="03:15">03:15</option>
                          <option value="03:30">03:30</option>
                          <option value="03:45">03:45</option>
                          <option value="04:00">04:00</option>
                          <option value="04:15">04:15</option>
                          <option value="04:30">04:30</option>
                          <option value="04:45">04:45</option>
                          <option value="05:00">05:00</option>
                          <option value="05:15">05:15</option>
                          <option value="05:30">05:30</option>
                          <option value="05:45">05:45</option>
                          <option value="06:00">06:00</option>
                          <option value="06:15">06:15</option>
                          <option value="06:30">06:30</option>
                          <option value="06:45">06:45</option>
                          <option value="07:00">07:00</option>
                          <option value="07:15">07:15</option>
                          <option value="07:30">07:30</option>
                          <option value="07:45">07:45</option>
                          <option value="08:00">08:00</option>
                          <option value="08:15">08:15</option>
                          <option value="08:30">08:30</option>
                          <option value="08:45">08:45</option>
                          <option value="09:00">09:00</option>
                          <option value="09:15">09:15</option>
                          <option value="09:30">09:30</option>
                          <option value="09:45">09:45</option>
                          <option value="10:00">10:00</option>
                          <option value="10:15">10:15</option>
                          <option value="10:30">10:30</option>
                          <option value="10:45">10:45</option>
                          <option value="11:00">11:00</option>
                          <option value="11:15">11:15</option>
                          <option value="11:30">11:30</option>
                          <option value="11:45">11:45</option>
                          <option value="12:00">12:00</option>
                          <option value="12:15">12:15</option>
                          <option value="12:30">12:30</option>
                          <option value="12:45">12:45</option>
                          <option value="13:00">13:00</option>
                          <option value="13:15">13:15</option>
                          <option value="13:30">13:30</option>
                          <option value="13:45">13:45</option>
                          <option value="14:00">14:00</option>
                          <option value="14:15">14:15</option>
                          <option value="14:30">14:30</option>
                          <option value="14:45">14:45</option>
                          <option value="15:00">15:00</option>
                          <option value="15:15">15:15</option>
                          <option value="15:30">15:30</option>
                          <option value="15:45">15:45</option>
                          <option value="16:00">16:00</option>
                          <option value="16:15">16:15</option>
                          <option value="16:30">16:30</option>
                          <option value="16:45">16:45</option>
                          <option value="17:00">17:00</option>
                          <option value="17:15">17:15</option>
                          <option value="17:30">17:30</option>
                          <option value="17:45">17:45</option>
                          <option value="18:00">18:00</option>
                          <option value="18:15">18:15</option>
                          <option value="18:30">18:30</option>
                          <option value="18:45">18:45</option>
                          <option value="19:00">19:00</option>
                          <option value="19:15">19:15</option>
                          <option value="19:30">19:30</option>
                          <option value="19:45">19:45</option>
                          <option value="20:00">20:00</option>
                          <option value="20:15">20:15</option>
                          <option value="20:30">20:30</option>
                          <option value="20:45">20:45</option>
                          <option value="21:00">21:00</option>
                          <option value="21:15">21:15</option>
                          <option value="21:30">21:30</option>
                          <option value="21:45">21:45</option>
                          <option value="22:00">22:00</option>
                          <option value="22:15">22:15</option>
                          <option value="22:30">22:30</option>
                          <option value="22:45">22:45</option>
                          <option value="23:00">23:00</option>
                          <option value="23:15">23:15</option>
                          <option value="23:30">23:30</option>
                          <option value="23:45">23:45</option>
                      </select>
                    </div></td>
                    <td><div align="left"><strong>Actual Income </strong></div></td>
                    <td><div align="left"><span class="style16">&pound;</span>                          <input name="textfield" type="text" value="0.00" size="6">
                    </div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Finish Time </strong></div></td>
                    <td><div align="left">N/A</div></td>
                    <td><div align="left">Actual Cost </div></td>
                    <td><div align="left"><span class="style16">&pound;</span>
                          <input name="textfield" type="text" size="6" value="0.00">
                    </div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"><strong>Comments</strong></div></td>
                    <td><div align="left">
                      <input name="textfield" type="text" value="" size="20">
                    </div></td>
                    <td><div align="left"><strong>Profit / Loss </strong></div></td>
                    <td><div align="left">£<font color='red'>0.00</font> - <font size=1>Figures Required To Calculate</font></div></td>
                  </tr>
                  <tr>
                    <td height="1" colspan="4" bgcolor="#0065C9"></td>
                  </tr>
                  <tr>
                    <td><div align="left"></div></td>
                    <td><div align="left">
                    </div></td>
                    <td><div align="left"></div></td>
                    <td><div align="left"></div></td>
                  </tr>
                  <tr>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                  </tr>
                  <tr>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                    <td>&nbsp;</td>
                  </tr>
                </table>
              </form>


                    </th>
            </tr>
          </table></td>
      </tr>
    </table></td>
  </tr>
</table>
<br>
<table width="100%"  border="0" cellspacing="0" cellpadding="5">
  <tr bgcolor="#E60F11">
    <td height="6" colspan="2"></td>
  </tr>
  <tr bgcolor="#003B8C" class="style7">
    <td width="48%" height="6"><div align="left" class="style15">Copyright &copy; 2005 - 2006, All Rights Reserved. </div></td>
    <td width="52%"><div align="right" class="style15">IT Support: Dave Gibson, 07834 596 029 </div></td>
  </tr>
</table>

</body>
                    <script type="text/javascript">
                        createEditableSelect(document.forms[1].Driver);
                        createEditableSelect(document.forms[1].Mate);
                    </script>

</html>
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16894853

haha no prob.
0
 
LVL 6

Author Comment

by:davecestria
ID: 16894881
Just a quick question though, why does putting it after the </body> tag make a difference??
0
 
LVL 10

Expert Comment

by:0h4crying0utloud
ID: 16895065

I guess IE first has to read the whole body before it starts adding it's "child" elements in the DOM. And you cannot reference something that is not yet in the DOM.  FF must be  adding children as soon as it sees and creates them.  
0
 
LVL 6

Author Comment

by:davecestria
ID: 16900505
Thank you. You've been a great help.
0

Featured Post

MS Dynamics Made Instantly Simpler

Make Your Microsoft Dynamics Investment Count  & Drastically Decrease Training Time by Providing Intuitive Step-By-Step WalkThru Tutorials.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses
Course of the Month11 days, 18 hours left to enroll

623 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question