github/bootstrap
1
1
Fork 0
mirror of https://github.com/jasny/bootstrap.git synced 2026-04-24 03:00:49 -04:00
Code Issues Packages Projects Releases Wiki Activity

Implemented table-href

Browse Source 
Added bootstap-table-href.js
Added css for `td[data-href]` in tables.less

Conflicts:

	Makefile
	docs/templates/layout.mustache
	docs/templates/pages/javascript.mustache
This commit is contained in:
Arnold Daniels
2012-02-21 23:45:34 +01:00
parent 9ad493e724
commit dc77bd68d6
5 changed files with 85 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
docs/templates/layout.mustache vendored
View File

@@ -111,6 +111,7 @@
<script src="assets/js/bootstrap-typeahead.js"></script>
<script src="assets/js/bootstrap-inputmask.js"></script>
<script src="assets/js/bootstrap-placeholder.js"></script>
<script src="assets/js/bootstrap-table-href.js"></script>
<script src="assets/js/application.js"></script>
{{#production}}

43
docs/templates/pages/javascript.mustache vendored
View File

@@ -19,6 +19,7 @@
<li><a href="#typeahead">{{_i}}Typeahead{{/i}}</a></li>
<li><a href="#placeholder">{{_i}}Placeholder{{/i}}</a></li>
<li><a href="#inputmask">{{_i}}Input mask{{/i}}</a></li>
<li><a href="#table-href">{{_i}}Table href{{/i}}</a></li>
</ul>
</div>
</header>
@@ -116,6 +117,12 @@
<p>{{_i}}Make sure the user types in the data that you want, by using an input mask.{{/i}}</p>
</label>
</div>
<div class="span3">
<label>
<h3><a href="./javascript.html#table-href">Table href</a></h3>
<p>{{_i}}A simple plugin, to turn table rows into a links.{{/i}}</p>
</label>
</div>
<div class="span3">
<label>
<h3>{{_i}}Transitions{{/i}} <small class="muted">*</small></h3>
@@ -1373,6 +1380,7 @@ $('.myCarousel').carousel({
</div>
</section>
<<<<<<< HEAD
<!-- Placeholder
@@ -1440,4 +1448,39 @@ $('.myCarousel').carousel({
<p>{{_i}}Initializes an input with an input mask.{{/i}}</p>
</div>
</div>
</section>
<!-- Table-href
================================================== -->
<section id="table-href">
<div class="page-header">
<h1>{{_i}}Table href{{/i}} <small>bootstrap-table-href.js</small></h1>
</div>
<div class="row">
<div class="span3 columns">
<h3>{{_i}}About{{/i}}</h3>
<p>{{_i}}A plugin to turn a table row into a clickable link.{{/i}}</p>
<a href="assets/js/bootstrap-table-href.js" target="_blank" class="btn">{{_i}}Download file{{/i}}</a>
</div>
<div class="span9 columns">
<h2>{{_i}}Example{{/i}}</h2>
<table class="table table-striped table-bordered">
<tr><th>{{_i}}Name{{/i}}</th><th>{{_i}}Description{{/i}}</th><th>Actions</th></tr>
<tr data-href="./javascript.html#modals"><td>{{_i}}Modals{{/i}}</td><td>{{_i}}A streamlined, but flexible, take on the traditional javascript modal plugin with only the minimum required functionality and smart defaults.{{/i}}</td><td class="nohref"><a href="#">Action</a></td></tr>
<tr data-href="./javascript.html#dropdowns"><td>{{_i}}Dropdowns{{/i}}</td><td>{{_i}}Add dropdown menus to nearly anything in Bootstrap with this simple plugin. Bootstrap features full dropdown menu support on in the navbar, tabs, and pills.{{/i}}</td><td class="nohref"><a href="#">Action</a></td></tr>
<tr data-href="./javascript.html#scrollspy"><td>{{_i}}Scrollspy{{/i}}</td><td>{{_i}}Use scrollspy to automatically update the links in your navbar to show the current active link based on scroll position.{{/i}}</td><td class="nohref"><a href="#">Action</a></td></tr>
<tr data-href="./javascript.html#tabs"><td>{{_i}}Togglable tabs{{/i}}</td><td>{{_i}}Use this plugin to make tabs and pills more useful by allowing them to toggle through tabbable panes of local content.{{/i}}</td><td class="nohref"><a href="#">Action</a></td></tr>
<tr data-href="./javascript.html#tooltips"><td>{{_i}}Tooltips{{/i}}</td><td>{{_i}}A new take on the jQuery Tipsy plugin, Tooltips don't rely on images, uss CSS3 for animations, and data-attributes for local title storage.{{/i}}</td><td class="nohref"><a href="#">Action</a></td></tr>
</table>
<h3>{{_i}}Markup{{/i}}</h3>
<p>{{_i}}Add the <code>data-href</code> attribute to a tr element. A column can be excluded by adding the <code>.nohref</code> class.{{/i}}</p>
<pre class="prettyprint linenums">
&lt;table&gt;
&lt;tr data-href="javascript.html#modals"&gt;&lt;td&gt;Modals&lt;/td&gt;&lt;td class="nohref"&gt;&lt;a href="#"&gt;Action&lt;/a&gt;&lt;/td&gt;&lt;/tr&gt;
&lt;/table&gt;
</pre>
</div>
</div>
</section>