github preview feature with rails 3.2

Question

I'm using twitter bootstrap tabbable:

http://twitter.github.com/bootstrap/components.html#tab3

and I would like to know, how can I replicate the preview effect when a user open a new issue on github and press on preview tab. I want preview the actual item before post this item.

You can see for example:

https://github.com/samwillis/pagedown-bootstrap/issues/new

You can click on preview and preview your issue.

I would like if exist some plugin or library to make this feature with jquery, or exist some gem for this purpose because github is made with ruby on rails.

Thank you very much!

Answer 1

Give the preview tab link an ID and use the show event of the tab to update the content. How you access the data to provide to tab content will depend on WYSIWYG you are using

$('#preview_tab').on('show',function(){
    var preview=$('#comment').val();
    preview= preview.length ? preview : 'No Comment provided'
    $('#preview_pane').html(preview)
});

DEMO: http://jsfiddle.net/hrXCC/

API Reference (see Events for tabs) : http://twitter.github.com/bootstrap/javascript.html#tabs