Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <head>
- <meta name="generator"
- content="HTML Tidy for HTML5 (experimental) for Windows https://github.com/w3c/tidy-html5/tree/c63cc39" />
- <style>
- #json{
- /* display:none;*/
- }
- #resultTxt {
- margin: 10px;
- padding: 15px;
- border: 1px solid blue;
- width: 79%;
- min-height: 30px;
- background: lightblue;
- }
- #contoh{width:80%;min-height:100px;}
- table.example {
- background: lightblue;
- }
- table.example tr:nth-child(odd) {
- background: #f6fce6;
- }
- table.example tr:nth-child(even) {
- background: #dee7fc;
- }
- </style>
- <title></title>
- </head>
- <body>
- <form>
- <textarea id='contoh' onkeyup='convert(2)' onchange='convert(2)'></textarea>
- <br/><textarea id='json' name='json'>dalam coding.. ini tidak akan terlihat</textarea>
- <input type='button' value='tes' onclick='convert()' /><input type='button' value='submit' onclick='submitThis()' />
- </form>
- <div>Preview:
- <p id='resultTxt'>ss</p>
- </div>
- <script>
- function submitThis(){
- alert('anggap disubmit! data yang diproses ada di json!!');
- }
- function convert(time=0){
- timeOut=time * 1000;
- target=document.getElementById('contoh');
- txt=target.value.trim();
- console.log(txt);
- rows= txt.split("\n");
- console.log(rows);
- result='<table class="example">';
- data={}
- for(i=0;i<rows.length;i++){
- row=rows[i];
- ar=row.split("\t");
- result = result + '<tr><td>';
- result = result + ar.join("</td>\n<td>");
- key = ar[0];
- data[key]=ar;
- result = result + '</td></tr>'
- }
- result=result+'</table>';
- console.log(result);
- document.getElementById('resultTxt').innerHTML ='sedang di proses';
- setTimeout(function(){
- document.getElementById('resultTxt').innerHTML = result;
- document.getElementById('json').innerHTML = JSON.stringify(data);
- // target.style.display='none';
- console.log(target);
- },timeOut);
- }</script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement