CODEWITHSUNDEEP
jqueryhtml-tablefacebox
leora
leora

Reputation: 196761

Is there anyway to popup a facebox dialog when clicking inside of a table TD cell

I want to popup a dialog facebox when I click inside a td in an html table. Is this possible ?

https://github.com/defunkt/facebox

Upvotes: 1

Views: 1113

Answers (1)

Sampson
Sampson

Reputation: 268434

TD as a proxy...

If you have a link in there, you could do something like this:

$("td").click(function(){
  $("a[rel='facebox']", this).trigger("click");
});

Of course, modifying that code slightly, you could invoke facebox for any link by clicking nearly anything else on the page. Basically, the td element serves as a proxy for you. If you click it, it triggers a click on the link that will be capable of opening facebox up.

No link? No problem...

If you don't have a link to click, you could create one of the fly, trigger a click, and then remove it.

$("td").click(function(e){
  $("<a>") // create our link
    .click(function(e){e.stopPropagation()}) // prevent bubbling
    .attr({ // set its attributes
      'href':'/css/style.css?'+$(this).text(), // append td vals
      'rel':'facebox' // make it facebox-eligible
    })
    .appendTo(this) // append it to the td
    .facebox() // tie it to facebox
    .click() // click it
    .remove(); // remove it
});​

So assume we started out with:

<td>52</td>

We will have an iframe popup pointing to: /css/style.css?52.

Upvotes: 3

Related Questions