StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POjQuery Accordion header with jQuery UI icon button (hide/show + hover/click)
primarykey
Id
20545477
data
AcceptedAnswerId
20638538
AnswerCount
3
ClosedDate
CommentCount
4
CommunityOwnedDate
CreationDate
2013-12-12T13:56:32.120
FavoriteCount
0
LastActivityDate
2015-04-16T07:11:19.977
LastEditDate
2013-12-17T10:23:08.387
LastEditorUserId
2931917
OwnerUserId
2931917
ParentId
0
PostTypeId
1
Score
11
ViewCount
7336
LastEditorDisplayName
text
Body
<p>What i need: a jQuery UI framework button like the one that can be found here: <a href="http://jqueryui.com/themeroller/" rel="noreferrer">http://jqueryui.com/themeroller/</a> (look at Framework Icons) in a jQuery accordion header.</p> <p>Live Sample: <a href="http://www.nikollr3.three.axc.nl/" rel="noreferrer">http://www.nikollr3.three.axc.nl/</a></p> <p>(From what i understood; a button can also be mimicked by an Achor tag with the right jQuery UI class.)</p> <p>Requirements: I do not want the button/icon to be shown when the header is NOT currently selected. On the other hand, if the header is selected, and thus also it's DIV is shown, i want the icon/button to be displayed. Look at the first image from the left, in that state i do not want the "+" button to be shown. In all other images (where it is focused/selected) i do want it to be shown.<strong>This currently NOT implemented; how to do this?</strong></p> <p>-> If the button is clicked, i want statProp to be displayed, i have a function showStatProp() for this.</p> <p>Issues i am having currently: <strong>Hover over 'button' is not doing anything</strong>, because currently when the header is selected, the same css is somehow applied to the button as is to the header (look at the cross color of the button: dark grey to black) (there is no seperate hover).</p> <p>How to get to this? i am currently stuck as there is limited documentation/information to be found on the internet about this specific thing i am trying.</p> <pre><code>function showStatProp() { if(document.getElementById("statProp").style.display == "none") { document.getElementById("statProp").style.display = 'block'; } else { document.getElementById("statProp").style.display = 'none'; } } </code></pre> <p>HTML:</p> <pre><code><body onkeydown="controlCheck(event)" onkeyup="clearPress()" > <div id="application" style="position:absolute"> <div id="accordion"> <h3 id="clickStat">Stations <span style="float:right;" class="ui-state-default ui-corner-all"> <a class="ui-icon ui-icon-plusthick btpad" href="/getPunten.php">Edit</a> </span></h3> <div id="stations"> <input type="text" id="stations_ac" onclick="this.value='';" /> <div id="selectedStationDiv"> </div> <hr> <div id="statProp" style="display:none;"> <p>Name: <input type="text" style="float:right; clear:right" size="19" id="statNam" onclick="this.value='';" /></p> <p style="margin-top:15px"> Type: <select id ="statTyp" style ="float:right" onchange=""> <option></option> <option title="Test">T</option> </select> </p> <p style="margin-top:15px"> Admtyp: <select id ="admtyp" style ="float:right" onchange="FilterByToestanden()"> <option></option> <option title="Alarm">A</option> <option title="Alarm">D</option> <option title="Urgent alarm">U</option> </select> </p> <p>Image: <input type="text" id="statBildnam" size="12" style ="float:right;text-transform: uppercase"></p> <p id="devText">Text: <input type="text" style="float:right; clear:right" id="texts_ac" onclick="this.value='';" /></p> <p> <p id ="respLine">Responsible: <select id="statResp" style="margin-bottom:10px;margin-top:6px;"><option>WERKHUIS-EMG-WEVELGEM</option></select></p> <button id="btnCrtStat" onClick="createStation()" type="button" style="margin-left:26px;margin-top:-3px">Create</button> </div> </div> <h3 id="clickImages" onclick="listImages()">Images</h3> <div id="imagesList" style="overflow:auto"> <ul id='imagesUL'></ul> <button onClick="addImage()" type="button" style="margin-left:26px;margin-top:-3px">Add image</button> </div> </code></pre> <p><img src="https://i.stack.imgur.com/rWgQB.png" alt="enter image description here"></p>
Tags
<javascript><jquery><html><css><jquery-ui>
Title
jQuery Accordion header with jQuery UI icon button (hide/show + hover/click)
singulars
PostAcceptedAnswerId
1. PO
  singulars
  PostTypePostTypeId
  PTAnswer
PostParentId
1. This table or related slice is empty.
PostTypePostTypeId
1. PTQuestion
UserLastEditorUserId
1. USFaarbhurtz
UserOwnerUserId
1. USFaarbhurtz
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
2. PO
  singulars
  PostTypePostTypeId
  PTAnswer
3. PO
  singulars
  PostTypePostTypeId
  PTAnswer
VotesPostIdCreationDate
1. VO
  singulars
  PostPostId
  POjQuery Accordion header with jQuery UI icon button (hide/show + hover/click)
  UserUserId
  USFaarbhurtz
  VoteTypeVoteTypeId
  VTBountyStart
2. VO
  singulars
  PostPostId
  POjQuery Accordion header with jQuery UI icon button (hide/show + hover/click)
  UserUserId
  This table or related slice is empty.
  VoteTypeVoteTypeId
  VTUpMod
3. VO
  singulars
  PostPostId
  POjQuery Accordion header with jQuery UI icon button (hide/show + hover/click)
  UserUserId
  This table or related slice is empty.
  VoteTypeVoteTypeId
  VTUpMod
CommentsPostId

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.