Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Code from my live editing w/ server side languages in Adobe Edge Code/Brackes screencast
<html>
<head>
<link href="index.css" rel="stylesheet" />
</head>
<body>
<cfquery
name="statesQuery"
datasource="census"
cachedwithin="#createTimespan(365,0,0,0)#">
select distinct stusab
from geo_header
order by stusab asc
</cfquery>
<div id="menu">
<ul>
<cfoutput query="statesQuery">
<li><a href="index.cfm?state=#stusab#">#stusab#</a></li>
</cfoutput>
</ul>
</div>
<div id="content">
<cfparam
name = "state"
default = ""
type = "string" />
<cfif state EQ "">
<h1>Please select a state</h1>
<cfelse>
<h1>Counties for <cfoutput>#state#</cfoutput>:</h1>
<cfquery name="counties" datasource="census"
cachedwithin="#createTimespan(365,0,0,0)#">
select stusab, logrecno, county, name, intptlat, intptlon, pop100
from geo_header
where stusab = <cfqueryparam cfsqltype="CF_SQL_CHAR" value="#state#"/> and county is not null and sumlev = 50
order by name
</cfquery>
<div class="table">
<div class="header">
<div>Name</div>
<div>County</div>
<div>Record Number</div>
<div>Interpolated Latitude</div>
<div>Interpolated Longitude</div>
<div>Population</div>
</div>
<cfoutput query="counties">
<div>
<div>#name#</div>
<div>#county#</div>
<div>#logrecno#</div>
<div>#intptlat#</div>
<div>#intptlon#</div>
<div>#pop100#</div>
</div>
</cfoutput>
</div>
</cfif>
</div>
</body>
</html>
body {
margin:0px;
padding:0px;
}
#menu {
position:absolute;
left:0px;
top:0xp;
width: 200px;
background:#ddd;
margin:0px;
padding:0px;
}
#content {
position:absolute;
left:200px;
top:0xp;
right:0px;
padding:10px;
}
.table {
display:table;
width:100%;
}
.table>div {
display:table-row;
}
.table>div>div {
display:table-cell;
padding:4px;
}
H1 {
margin-top:0px;
}
.table>div:nth-child(2n) {
background: #EEE;
}
.header {
font-weight:bold;
color:white;
background:#555;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment