Wednesday, August 26, 2009

Dirty Franks!

A friend of mine told me about this "hot dog" place called "Dirty Franks" - so in the name of trying new restaurant, we went. Here are some information about Dirty Franks:

Website: http://www.dirtyfrankscolumbus.com/
Twitter: http://twitter.com/dirtyfranksdogs

248 South 4th Street
Columbus, Ohio 43215
614.824.4673
Hours: 11am to 2:30am

Food:
I think their food is great. Their menu is basically hot dogs with different styles. You can get Chicago style hot dog, hot dog with kim chee, with beans, topped with brisket, or anyway you want it (called "Your Wiener"). See their full menu here. You can substitute the franks with Polish sausage, brats, veggie sausage, etc. I have tried several of them and I like "Dog From Hell" and "Chicago" the most (out of the seven or so).

Drinks:
They have a full bar - which is nice. But, the stuff to get is the Slushes or Root Beer Floats. They use the local Jenis ice cream for their floats - which is awesome.

Price:
Relatively cheap - $3 per hot dog. So if you are only after 1 dog, side and drink water, it will cost you $5-ish. I ordered 2 dogs, a side, and pop - set me back around $10 - and went home super full.

Atmosphere and Service:
The place is kinda small and packed during lunch hours. So if you are planning to come for lunch, come early (like before 11:30) or late. For dinner, it is still packed, but not as bad. Decoration is kinda funky/artsy - which is - depending on your taste - could be weird or cool. I personally like it. Service is superb, my drink is never empty, meal is fast, and my server is friendly.

So, check them out!
-- read more and comment ...

Sunday, August 23, 2009

How to hide/show Table Rows with jQuery

With jQuery, hiding and showing DOM elements are easy. But, one thing that I find a little bit challenging is hiding table row(s). Hiding and showing DIVs are easy:

function togglePanel(id) {
var viewContainer = $(id);
viewContainer.slideToggle("normal");
}

Or you can use show() and hide() or fadeIn() and fadeOut(). With our corresponding HTML:
<a href="javascript:togglePanel('#myDiv')">Toggle</a>
<div id="myDiv">Hello World</div>


Now what if we are using TABLE instead of DIV??

Easy - Use TBODY tag. Here is an example using TABLE:
<table id=anothersortable>
<tbody id=row01 class=content>
<tr><td>one</td></tr>
</tbody>
<tbody id=row02 class=content>
<tr><td>two</td></tr>
</tbody>
</table>
<a href="javascript:togglePanelMore('#row01', '#togglerow01')"      id="togglerow01">less</a> for row01

Then our jQuery to be as such:
function togglePanelMore(id, source) {
var viewContainer = $(id);

if ($(source).html() == "more") {
$(source).html("less");
viewContainer.show();
}
else {
$(source).html("more");
viewContainer.hide();
}
}

IE 7 Quirks
In IE 8, you can refer to the TR directly without TBODY, like this:
<table id=anothersortable>
<tr id=row01><td>one</td></tr>
<tr id=row01><td>two</td></tr>
</table>
<a href="javascript:togglePanelMore('#row01', '#togglerow01')"
id="togglerow01">less</a> for row01
But for some reason, it is not reliably working in IE7.

Also, in IE7, putting speed inside the hide()/show() into becoming like hide('slow') won't work.

Here is a small demo.
-- read more and comment ...