gitgod
/
nanobind


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
							<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width">
        <title>Nano Bind Sample</title>
        <link href="index.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
        <div class='oneVar'>
            <div class='leftColumn'>
                <input type="text" id="text1">
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
<!--        <div class='oneVar'>
            <div class='leftColumn'>
                <p id='p1'></p>
                <p><input name="dzen" type="radio" value="nedzen"> Не дзен</p>
                <p><input name="dzen" type="radio" value="dzen"> Дзен</p>
                <p><input name="dzen" type="radio" value="pdzen" checked> Полный дзен</p>
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
            </div>
        </div> -->
        <div class='oneVar'>
            <div class='leftColumn'>
                <textarea id="textarea"></textarea>
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
        <div class='oneVar'>
            <div class='leftColumn'>
                <div id='menu'>
                    <a href='#' style='color: red; margin-right: 15px;'></a>
                    <a href='#' style='color: green; margin-right: 15px;'></a>
                </div>
               <!-- <ul id='menu'>
                    <li></li> 
                </ul> -->
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
        <div class='oneVar'>
            <div class='leftColumn'>
                <select id="select">
                    <option value="">--</option>
                    <!--<option value="M" style="background-color: gray;">Male</option>-->
                    <!--<option value="F">Female</option>-->
                    <!--<option value="X">Xenomorph</option> -->
                </select>
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
        <div class='oneVar'>
            <div class='leftColumn'>
                <input type='checkbox' id='check1'>
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
        <div class='oneVar'>
            <div class='leftColumn'>
                <input id='someInput' />
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
        <div class='oneVar'>
            <div class='leftColumn'>
                <table>
                    <tbody id="numberTable">
                        <tr>
                            <td><input>table template line 1</td>
                            <td style='background-color: blue;'>table template line 1</td>
                        </tr>
                        <tr style='background-color: gray;'>
                            <td>table template line 2</td>
                            <td style='background-color: red;'>table template line 2</td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
        <div class='oneVar'>
            <div class='leftColumn'>
                <table>
                    <thead>
                        <th> age</th>
                        <th> married</th>
                        <th> surname</th>
                        <th> name</th>
                        <th> note</th>
                    </thead>
                    <tbody id="hashTable">
                        <tr>
                            <td class='age'></td>
                            <td><input type='checkbox' class='married'></td>
                            <td class='surname'></td>
                            <td class='name'></td>
                            <td><textarea class='note'></textarea></td>
                            <td><button class='btnDel'>x</button></td> 
                        </tr>
                    </tbody>
                </table>
                <button id='addPerson'> add person </button>
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
<!--        <div class='oneVar'>
            <table>
                <tbody id="persons">
                    <tr>
                        <td><input type='number' style='max-width:50px;'></td>
                    </tr>
                </tbody>
            </table>
        </div> -->
        <div class='oneVar'>
            <div class='leftColumn' id="checks">
                <label><input type='checkbox' class='check'><span class='description'></span><br/></label>
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
        <div class='oneVar'>
            <div id="radios" class='leftColumn'>
                <label><input type='radio' class='radio'><span class='description'></span><br/></label>
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
        <div class='oneVar'>
            <div class='leftColumn'>
                <table>
                    <tbody id="ediTable">
                        <tr>
                            <td><!--<input type='number' style='max-width:50px;'>--></td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class='rightColumn'>
                <h3 class='key'></h3>
                <textarea class='data'>
                </textarea>
                <button class='update'>Update</button>
            </div>
        </div>
        <!--
        <strong>Use $s variable for accessing data in DOM</strong>
        <pre id='state' style='background-color: lightgray;'>
            2 seconds timeout
        </pre>
        -->

        <script src="nb.js"></script>
        <script src="index.js"></script>
    </body>
</html>