StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POHighlight a row of a table with JQuery / Bootstrap using anchors
primarykey
Id
16876386
data
AcceptedAnswerId
16876717
AnswerCount
1
ClosedDate
CommentCount
1
CommunityOwnedDate
CreationDate
2013-06-01T19:23:33.670
FavoriteCount
0
LastActivityDate
2017-03-05T19:59:25.823
LastEditDate
2017-03-05T19:59:25.823
LastEditorUserId
272387
OwnerUserId
2061450
ParentId
0
PostTypeId
1
Score
1
ViewCount
4720
LastEditorDisplayName
text
Body
<p>I'm using Bootstrap (Twitter) and JQuery. I have a table with some data and each row has an id. I have a typeahead to search data in my table. When I select a data in my typeahead, I would like to highlight the correct row, that why I use the anchors. But, I don't know how to highlight the row.</p> <p>Here my JQuery code:</p> <pre><code>$(document).ready(function() { $('#typeahead').change(function() { window.location = "#" + $(this).val(); //highlighting the row... }); }); </code></pre> <p>This HTML code is just for testing:</p> <pre><code><a href="#row1">Row1</a> <a href="#row2">Row2</a> <table class="table table-hover table-bordered"> <tr id="row1"> <td>A</td> <td>B</td> </tr> <tr id="row2"> <td>C</td> <td>D</td> </tr> </table> </code></pre> <p>Here the code for the typeahead:</p> <pre><code><input type="text" id="typeahead" data-provide="typeahead" placeholder="Search a name" data-items="4" data-source='[ <?php for($i = 0 ; $i < count($typeahead) ; $i++) { if($i+1 == count($typeahead)) echo '"'.$typeahead[$i].'"'; else echo '"'.$typeahead[$i].'",'; } ?>]'> </code></pre> <p>Here the content of the typeahead array:</p> <pre><code><input type="text" id="typeahead" data-provide="typeahead" placeholder="Search a name" data-items="4" data-source='["Christophe Chantraine","Toto Tuteur","Henris Michaux","Robert Patinson","Benjamin Brégnard","Jean-Charles Terzis","Ludovic Dermience","Claude Dianga"]'> </code></pre> <p>Here is a sample code to introduce my problem: <a href="http://jsfiddle.net/TK7QP/6/" rel="nofollow noreferrer">http://jsfiddle.net/TK7QP/6/</a></p>
Tags
<jquery><twitter-bootstrap><anchor><highlight><bootstrap-typeahead>
Title
Highlight a row of a table with JQuery / Bootstrap using anchors
singulars
PostAcceptedAnswerId
1. PO
  singulars
  PostTypePostTypeId
  PTAnswer
PostParentId
1. This table or related slice is empty.
PostTypePostTypeId
1. PTQuestion
UserLastEditorUserId
1. USRichlv
UserOwnerUserId
1. USLapinou
plurals
PostLinksPostIdRelatedPostId
1. This table or related slice is empty.
PostLinksRelatedPostIdPostId
1. This table or related slice is empty.
PostsAcceptedAnswerId
1. This table or related slice is empty.
PostsParentIdCreationDate
1. PO
  singulars
  PostTypePostTypeId
  PTAnswer
VotesPostIdCreationDate
1. This table or related slice is empty.
CommentsPostId
1. COCan you post the contents of the `$typeahead` array?
  singulars
  PostPostId
  POHighlight a row of a table with JQuery / Bootstrap using anchors
  UserUserId
  USfrostyterrier

Querying!

Guidance

A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.