I am currently learning SQL. On my CFM page I have entered all the information from the instructions my professor has given us. I have even compared to other students to try and figure out what is wrong, but their pages look like mine. Please help me figure out what I have done wrong. Thanks.
This is the webpage link http://pretendcompany.com/jaedenemployees.html
Error:
72777A, on line 66, column 32, is not a valid identifer name. The CFML
compiler was processing: The body of a CFOUTPUT tag beginning on line
62, column 3.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="YOUR NAME HERE" />
<title>USU MIS 2100</title>
<style type="text/css" media="all">
td {
align:center;
width:955;
border:none;
text-align:center;
vertical-align:top;
height:40px;
}
table.center{
margin:auto;
}
h1{
font-size:26px;
color:#001F3E;
}
h2{
font-size:20px;
color:#ffffff;
}
img{ text-align:center;
}
td.photo{
margin:auto;
}
</style>
</head>
<body>
<table class="center">
<tr>
<td ><img src="images/header2_usu.jpg" width="755" height="265" alt="usu" /></td>
</tr>
<tr>
<td style="height:900;background-color:#D7D9D9;padding-top:50px;">
Employees by Department at Pretend Company, Inc.</font></p>
<h1>Jaeden Harris</h1>
<CFQUERY name="jaeden" datasource="employeedatasource">
select Accounting,Administrative,Advertising,Payroll,Sales
from employees
where DepartmentName in(#PreserveSingleQuotes(form.SelectDepts)#)
</CFQUERY>
<!--Place opening CFOUTPUT here -->
<CFOUTPUT query="jaeden">
<table style="width:500;border:none;" class="center">
<tr style="background-color:#72777A;">
<td colspan="2"><h2> #DepartmentName# Employees </h2></td>
</tr>
<tr>
<td style="width:250;text-align:left;">Employee:#FirstName# #MiddleName# #LastName#
<p>Title: #Title#
<p>Email: #EmailName# #pretendcompany.com
<p>Contact Number: #WorkPhone#
</p>
</td>
<td style="width:140px;vertical-align:middle;" class="photo"><!--Reference Photograph field here --> </td>
</tr>
</table>
</CFOUTPUT>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
You are within a CFOUTPUT, therefor anything with # signs gets evaluated, including the style background-color:#72777A;. Either escape those with a double hash: background-color:##72777A; or move the style out of your CFOUTPUT.
Since you already have a section for your CSS, it may be wise for you to move all your table styles from inline with the HTML to the top and just apply classes to your elements.
Related
I have an application that still uses popup windows over Modals, and we need to test the behavior of some of the popups. In my current stage of research it appears the failure occurs on a waitForPopup call. To confirm this, I made a basic HTML page to throw a popup when a link is clicked (easily simulated with IDE)
<html>
<head>
<title>Test Popup</title>
</head>
<body>
Click Me
</body>
<script>
function openwindow() {
var i, l, options = [{
value: 'first',
text: 'First'
}, {
value: 'second',
text: 'Second'
}],
newWindow = window.open("", "popup1", "height=200,width=400,status=yes,toolbar=no,menubar=no,location=no");
newWindow.document.write("<select onchange='window.opener.setValue(this.value);'>");
for(i=0,l=options.length; i<l; i++) {
newWindow.document.write("<option value='"+options[i].value+"'>");
newWindow.document.write(options[i].text);
newWindow.document.write("</option>");
}
newWindow.document.write("</select>");
}
function setValue(value) {
document.getElementById('value').value = value;
}
</script>
</body>
And the Selenium test case
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://selenium-ide.openqa.org/profiles/test-case">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="selenium.base" href="http://localhost.localdev.com/" />
<title>localpopuptest</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">localpopuptest</td></tr>
</thead><tbody>
<tr>
<td>click</td>
<td>id=click_me</td>
<td></td>
</tr>
<tr>
<td>click</td>
<td>id=click_me</td>
<td></td>
</tr>
<tr>
<td>waitForPopUp</td>
<td>popup1</td>
<td>30000</td>
</tr>
<tr>
<td>assertTitle</td>
<td></td>
<td>Test Popup</td>
</tr>
</tbody></table>
</body>
</html>
This seems to be a common issue, is there a better way to track and assert popup windows?
Check this out:
click | id=click_me
selectWindow | popup1
select | //select | Second
If your popup has a dynamic content you can just add:
waitForElementPresent | //select
after selectWindow.
I am creating an application that will show to the user a formatted message in an UIWebView loading local HTML content.
I am using GRMustache to render the html to be displayed and bootstrap as css.
Everything works fine, the css is loaded, but when i want to display tables, the css is not recognized.
I don't know if UIWebView is not capable to recognize the css of the tables, but in the apple documentation just read that have the same capabilities than safari.
Here i put my template.
<!DOCTYPE html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
{{style}}
</style>
</head>
<body>
<h1> Message </h1>
<button class="btn btn-success"> Button </button>
<table class="table table-striped">
<tbody>
{{# detalle}}
<tr >
<td> {{capitalized(key) }} </td>
<td> {{ capitalized(object)}} </td>
</tr>
{{/ detalle}}
</tbody>
</table>
</body>
Here is an image of my UIWebView:
https://www.dropbox.com/s/or5vrqxxqbjqjoh/bootstrap%20app.png
The button css is rendered fine, but the table is not striped.
I checked my css, thinking than that was the problem, but it was just fine.
In this moment I can't find an answer for this problem.
i have a div element which is created via JS on the fly.
<div id='menu_item_0'>foo</div>
Now my Selenium IDE locator is able to access this element with various selectors, but whatever event like e.g. mouseOver or clickAt etc I use, they all seem to get ignored.
I could of course wirte some script an fire this, but i want to test exactly the mouseover by a mouse and not dispatch it by myself.
Anyone has an idea on this? The recorder does not record this too.
Thanks & Regards
Can you show us the complete html and js ?
Here's a test code I've run with success. Does it match what you're trying to do ?
The HTML :
<html>
<body>
<script>
function insert(){
var container = document.getElementById("container")
var newdiv = document.createElement('div');
newdiv.setAttribute('id','menu_item_0');
newdiv.innerHTML = 'Added the element';
newdiv.onmouseover = function(){
newdiv.innerHTML = 'I feel tickled';
}
newdiv.onclick = function() {
newdiv.innerHTML = 'I feel clicked';
}
container.appendChild(newdiv);
}
setTimeout(insert,2000);
</script>
<div id="container"></div>
</body>
</html>
And the selenium test (just save this in a .html file and open it from Selenium IDE) :
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head profile="http://selenium-ide.openqa.org/profiles/test-case">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="selenium.base" href="file:///G:/dev/proj/test-selenium-ide/" />
<title>test1</title>
</head>
<body>
<table cellpadding="1" cellspacing="1" border="1">
<thead>
<tr><td rowspan="1" colspan="3">test1</td></tr>
</thead><tbody>
<tr>
<td>open</td>
<td>index.html</td>
<td></td>
</tr>
<tr>
<td>waitForElementPresent</td>
<td>menu_item_0</td>
<td>2500</td>
</tr>
<tr>
<td>assertElementPresent</td>
<td>menu_item_0</td>
<td></td>
</tr>
<tr>
<td>mouseOver</td>
<td>menu_item_0</td>
<td></td>
</tr>
<tr>
<td>assertText</td>
<td>menu_item_0</td>
<td>I feel tickled</td>
</tr>
<tr>
<td>clickAt</td>
<td>menu_item_0</td>
<td></td>
</tr>
<tr>
<td>assertText</td>
<td>menu_item_0</td>
<td>I feel clicked</td>
</tr>
</tbody></table>
</body>
</html>
I am storing old html markup in my database, tracking changes, and then trying to render the diff using Differ and the :html format option.
The following code is successfully generated:
<table>
...
<tr>
<th style="width:60px; text-align:left;">
Owner:
</th>
<del class="differ">
<td>
<span id="someID">Previous Owner Name</span>
</td>
</del>
<ins class="differ">
<td>
<span id="someID">Current Owner Name</span>
</td>
</ins>
</tr>
...
</table>
Notice the <del> and <ins> tagged elements.
If I view the source, it looks fine.
But because apparently this would disrupt the table layout, all browsers seem to move these new elements to before the table. When I inspect the element, I get the following:
<del class="differ"> </del>
<ins class="differ"> </ins>
<table>
...
<tr>
<th style="width:60px; text-align:left;">
Owner:
</th>
<td>
<span id="someID">Previous Owner Name</span>
</td>
<td>
<span id="someID">Current Owner Name</span>
</td>
</tr>
...
</table>
I tried writing a custom Rails view helper to replace each <ins> and <del> with a <span>, but the same thing happens.
Is there a way to style the table using elements like I am trying to do, or am I going to have to walk the dom and apply styles to each appropriate <td> using javascript? I cannot replace the tables in the beginning because I don't control the source.
Thanks to David & Steve for confirming the issue, I was able to resolve this specific case by translating the <ins> and <del> tags into classes, and applying them to each child element using Nokogiri prior to rendering the view.
I created a table_safe helper as follows:
def table_safe(markup)
parsed = Nokogiri.parse(markup)
parsed.css('ins').children().each do |el|
if el['class']
el['class'] = el['class'] << ' ins'
else
el['class'] = 'ins'
end
end
parsed.css('del').children().each do |el|
if el['class']
el['class'] = el['class'] << ' del'
else
el['class'] = 'del'
end
end
parsed.to_s
end
This can obviously be refactored, but it solves the problem. Ideally I could modify the :html formatting option in the Differ gem so that it inserts the tags inside of the first nested element if that element itself has not changed. I'm not sure why this isn't the default functionality, but it is outside the scope of my capabilities.
Why not add a CSS stylesheet to copy the style class differ to all TD elements?
<link rel="stylesheet" type="text/css" href="some.css" />
And then a definition like this in the stylesheet:
td {
padding: 15px;
background-color: gold;
text: black;
font-family: Courier, "Courier New", Tahoma, Arial, "Times New Roman";
border: 1px solid black;
/* Some other properties here...... */
}
And a sample HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Anything</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="ja.css" />
</head>
<body bgcolor="white" text="black">
<table>
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td>C</td>
<td>D</td>
</tr>
</table>
</body>
</html>
Working example:
http://pastehtml.com/view/ckdf6rxo3.html
Maybe this W3Schools link will be useful:
CSS Styling Tables
I need to insert an applet into a table-row and get that table-row's height to dynamically resize according to the browser's window size. If I put fixed values for width & height in the td-tag, it shows the applet fine, but I need to be able to resize this according to the client's size capabilities, so using fixed sizes is not the answer.
The snippet below should illustrate where my problem lies:
<!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=UTF-8">
<title>JavaAppletTest </title>
</head>
<body bgcolor="#6f6f6f" >
<table border="0" cellspacing="0" cellpadding="0" width="100%" >
<tr valign="top">
<td><img src="images/myheader.jpg" alt="myheader.jpg"></td>
<td><img src="images/mylogo.jpg" alt="mylogo.jpg"></td>
</tr>
<tr >
<td colspan="2" >
<object codetype="application/java"
classid="java:applets.MyTestApplet.class">
<param name="codebase" value="." >
<param name="archive" value="MyTestApplet.jar" >
<param name="code" value="applets.MyTestApplet" >
</object>
</td>
</tr>
</table>
</body>
</html>
What do I need to do to make the row-dimensions dynamic?
[edit]
jitter's answer indicates a possible solution. I also need to adjust the relevant sizes when the user resizes the window: what event & how do I do that?
I suggest using javascript to write the object/embed tag and calculating the size dynamically.
This should do the trick basically but be aware of the fact that getting the correct width and size can be tricky. I refer you to Finding the size of the browser window.
...
<head>
...
<script type="text/javascript">
window.onresize = function(event) {
document.getElementById('myobject_tag').height = window.innerHeight;
document.getElementById('myobject_tag').width = window.innerWidth;
}
</script>
</head>
...
<body bgcolor="#6f6f6f">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr valign="top">
<td><img src="images/myheader.jpg" alt="myheader.jpg"></td>
<td><img src="images/mylogo.jpg" alt="mylogo.jpg"></td>
</tr>
<script type="text/javascript">
var height = window.innerHeight;
var width = window.innerWidth;
document.write(
'<tr><td colspan="2"><object id="myobject_tag"\n' +
'codetype="application/java"\n' +
'classid="java:applets.MyTestApplet.class"\n' +
'width="' + width + '"\n' +
'height="' + height + '"\n>' +
'<param name="codebase" value=".">\n' +
'<param name="archive" value="MyTestApplet.jar">\n' +
'<param name="code" value="applets.MyTestApplet">\n' +
'</object></td></tr>'
);
</script>
</table>
...