javascript hide row in table local storage -


im using formula hide whole html table.

function tableexpander(tableid) {     // our flag determine if rows hidden or not     var rowsvisible = localstorage.getitem('rowsvisible-'+tableid),         // table handler         table = document.getelementbyid(tableid);      // "rowhidden" not exists in localstorage yet     if (rowsvisible === null) {         rowsvisible = true;     } else {        // localstorage return string         rowsvisible = rowsvisible === 'true' ? true : false;     }      toggledisplay(table, rowsvisible ? '' : 'none');      table.getelementsbyclassname('togglebtn')[0].addeventlistener('click', function() {         toggledisplay(table);     }, false);      function toggledisplay(tbl) {             var tblrows = table.rows,             mode = rowsvisible ? '' : 'none';          (i = 0; < tblrows.length; i++) {             if (tblrows[i].classname != "headerrow") {                 tblrows[i].style.display = mode;             }         }          localstorage.setitem('rowsvisible-'+tableid, rowsvisible);         rowsvisible = !rowsvisible;     };     };  tableexpander('table'); tableexpander('table1');

how can modify hide 1 row @ time , change button color red when hidden? example here http://jsfiddle.net/sxaz4/85/

demo: http://jsfiddle.net/neh89/31/ (code below)

<table>     <tr class='row-1'>         <td>foo</td>     </tr>     <tr class='row-2'>         <td>bar</td>     </tr>     <tr class='row-3'>         <td>rab</td>     </tr> </table>  <!-- button toggle elements css class "row-1" --> <a class='btn hide-1' data-hide-element='row-1' data-default-mode='visible'>toggle row class "row-1"</a>  <!-- button toggle elements css class "row-2" --> <a class='btn hide-2' data-hide-element='row-2' data-default-mode='hidden'>toggle row class "row-2"</a>  <!-- button toggle elements css class "row-3" --> <!-- if @data-default-mode not specified "visible" --> <a class='btn hide-3' data-hide-element='row-3'>toggle row class "row-3"</a> 
    /**  * function toggle (shows/hides) elements ,   * remember visibility in browsers localstorage.  *  * @param {string} buttonscssclass buttons css class trigger toggle action.  * @return {void}  */ function toggleelements(buttonscssclass) {     var // our object of flags determine if elements hidden or not         elementsvisible = localstorage.getitem('elementsvisible'),         // list of buttons         btns = document.getelementsbyclassname(buttonscssclass);      // "rowhidden" not exists in localstorage yet     if (elementsvisible === null) {         elementsvisible = {};     } else {        // localstorage return string         elementsvisible = json.parse(elementsvisible);     }      // bind buttons     var = btns.length,         cls, mode, elements, x, btn;     while (i--) {         btn = btns[i];         cls = btn.getattribute('data-hide-element');         mode = btn.getattribute('data-default-mode');          if (typeof elementsvisible[cls] !== 'boolean') {             elementsvisible[cls] = (mode === 'visible' || mode === null) ? true : false;         }          btn.addeventlistener('click', function() {             var _cls = this.getattribute('data-hide-element');              elementsvisible[_cls] = ! elementsvisible[_cls];             localstorage.setitem('elementsvisible', json.stringify(elementsvisible));              toggledisplay(_cls, elementsvisible[_cls]);         }, false);          toggledisplay(cls, elementsvisible[cls], true);     }      function toggledisplay(cls, visible) {             var elements = document.getelementsbyclassname(cls);             x = elements.length;          while (x--) {             elements[x].style.display = visible ? '' : 'none';            }          // change color of buttons         var btns = document.queryselectorall('[data-hide-element="'+cls+'"]'),             = btns.length;         while (i--) {             btns[i].style.backgroundcolor = visible ? 'white' : 'red';            }     };        };  toggleelements('btn');

Comments

Post a Comment

Popular posts from this blog

java.util.scanner - How to read and add only numbers to array from a text file -

i'm learning java , have question regarding reading file want read numbers file contains strings well. here example of file: 66.56 "3 java 3-43 5-42 2.1 1 and here coding: public class test { public static void main (string [] args){ if (0 < args.length) { file x = new file(args[0]); try{ scanner in = new scanner( new fileinputstream(x)); arraylist<double> test = new arraylist<>(); while(in.hasnext()){ if(in.hasnextdouble()){ double f=in.nextdouble(); test.add(f);} else {in.next();} } catch(ioexception e) { system.err.println("exception during reading: " + e); } } my problem add 66.56,2.1 , 1 doesn't add 3 after "3 or ignores 3-43 , 5-42 can tell me how skip strings , add doubles here? thanks all said 3 ie; "3, 3-43 , 4-42 strings either u read string , split , check number @ " , - or put in space between characters , integers. jvm after compilation tre...
Read more

rewrite - Trouble with Wordpress multiple custom querystrings -

i'm working on adding multiple querystring , doesn't seem work. i've found codes seems work others might i'm missing something. i want like: http://mydomain.com/board/?getyear=2013&getsometext2=sometext to http://mydomain.com/board/2013/sometext/ i added code below functions.php file. doesn't seem work should though. this works. echoing querystring gets both variable without problem. http://mydomain.com/board/2013/sometext/ but doesn't. tested querystring vis isset() seems nothing being set/get http://mydomain.com/board/2013/ function add_query_vars($vars) { $vars[] = "getyear"; $vars[] = "getsometext2"; return $vars; } add_filter('query_vars', 'add_query_vars'); function add_rewrite_rules($arules) { $anewrules = array('board/([^/]+)/([^/]+)/?$' => 'index.php?pagename=board&getyear=$matches[1]&getsometext2=$matches[2]'); $arules = $a...
Read more