I have the following jQuery script that hides / spreads the row in the table:
Examples were:
& lt; Script type = "text / javascript" & gt; $ (Document) .ready (function () {$ ("# order tr: odd"). AddClass ("weird"); $ ("# order tr: not (.odd)") Hide (); $ ( "#orders tr: first-hair"). Show (); $ ("# command tr.odd"). Click (function () {$ (this) .next ("tr"). Toggle (); $ (This) .Find ("toggleer"). ToggleClass ("on"); $ (this) .find ("toggleer"). Text ("hide");});}); & Lt; / Script & gt; My HTML is:
& lt; Table class = "blueWrapperTbl" id = "command" & gt; & Lt; Tbody & gt; & Lt; TR & gt; & Lt; TD & gt; & Lt; H: output text value = "# {order.orderId}" /> & Lt; / TD & gt; & Lt; TD & gt; & Lt; H: output text value = "# {order.orderId}" /> & Lt; / TD & gt; & Lt; TD & gt; & Lt; H: output text value = "# {order.orderId}" /> & Lt; / TD & gt; & Lt; TD & gt; & Lt; H: output text value = "# {order.orderId}" /> & Lt; / TD & gt; & Lt; Td> & Lt; A href = "#" square = "ubber" & gt; & Lt; B & gt; Change order & lt; / B & gt; & Lt; / A & gt; & Lt; / Td> & Lt; Td> & Lt; A href = "#" square = "toggler" & gt; Show & lt; / A & gt; & Lt; / Td> & Lt; / TR & gt; & Lt; TR & gt; ... & lt; / Tr & gt; & Lt; / Table & gt; The related CSS parts are:
.blueWrapperTbl. Tagger {background: url (../ images / plus.gif) is not the right center -repeat; Paddle-right: 20px; Display: inline-block; Text: 'FFF'} .wpPertibilik Tagelier.on {background: url (../images/minas.gif) not right center again; } I need to do the following:
- When my line expires, I hide the 'toggler' text from 'show' I would like to change
- When my line is hidden I do not need to show the 'Change Order' URL. It should be hidden.
Please help me
toggle () and toggleclass () are function functions that make it simple to do simple things ... but they are limited. Instead of using toggleClass () , if you have a if to check that the element has an 'on' square, then to check. If this happens, remove that class and change the text to 'Show'. If it does not, add the 'On' class and change the text to 'Hide.' Instead of using toggle , , you can check the visibility of the row. If it is visible, hide it and hide the 'Change order' url. If this is not visible, show it and show the 'Change order' url.
Here is a hypothetical example:
$ ('# order td a') .each (function () (if ($ (this) .hasClass ('on ')) {$ (This) .removeClass (' on '); // do other things} and {$ (this) .addClass (' on '); // do other functions}}; I hope this will be helpful!
Comments
Post a Comment