Reason for Exam

a list of radiology items with separate and universal reason for exam boxes

by Ground_Zero

HTML

<table style="border:2px solid #006633" bgcolor="#CCBFA3"; width="100%">
    <tr>
      <th>Radiology</th>
    </tr>
    <tr>
      <td colspan=2><label>Main Reason for Exam:&nbsp;&nbsp;
        <input class="xsmallText" type="text" name="cprompt_200" size="25"/>
          </label>&nbsp;&nbsp;<font size="1">(individual reason boxes take precedence)</font> 
      </td>
    </tr>
    <tr>
      <td><table>
          <tr>
            <td width=280px><label>Reason for Exam:&nbsp;&nbsp;
              <input class="xsmallText" type="text" name="cprompt_201" size="20"/>
              </label>
            </td>
            <td><input type="checkbox" name="ord_81" id="orderId_81" value="true" />
              CXR portable 1 view stat once </td>
            <td></td>
          </tr>
          <tr>
            <td><label>Reason for Exam:&nbsp;&nbsp;
              <input class="xsmallText" type="text" name="cprompt_201" size="20"/>
              </label>
            </td>
            <td><input type="checkbox" name="ord_82" id="orderId_82" value="true" />
              Chest PA - lateral stat once </td>
          </tr>
        </table>
      </td>
    </tr>

CSS

body{
 background-color:#D1D1D1;  
 font-size: 62.5%; 
 margin: 30px;
}
td{
 text-align:left;
 font-family: Tahoma, Verdana, sans serif;
 font-size: 10pt;
 vertical-align:top;
}
td.checked { background: yellow; }
th{
 border-top: #006633 solid 1pt;
 border-bottom: #006633 solid 1pt;
 background-color: #FFF6E3;
 padding-left: 12px;
 text-align:left;
 font-family: Tahoma, Verdana, sans serif;
 color: green;
 font-weight: bold;
 font-size: 10pt;
 line-height: 15pt;
 vertical-align:top;
}

JavaScript

$("input:checkbox").click(function() { $(this).parent("td").toggleClass("checked");
});