javascript - auto refresh text box value -


i've multiple text field html, i'm getting value other page value dynamic it'll keep on change, need auto refresh text box every 1 sec, possible refresh text box value

note: io.html has var1, var2 etc.. variables values keep on change.., need track values in intex.html text box

    <script type="text/javascript">                setinterval(function () {                    $.getjson("io.html", function (data) {                        if (data.var1 == true) {                            $('#c1-cycle').text(data.trim());                        }                    });                }, 1000);              </script>
index.html  <html>    <head>      </head>    <body>      <table>       <tr >              <td class="c3-tap-col">              <div>              <input type="text" id="c1-cycle" class="c3-tap-tex" value=''>              counter              </div>              </td>             </tr>        </table>      </body>    </html>

alright, new information rebuilt example 1 one.

we have file values called io.html containing variables in non array json format:

{"var1": "30", "var2": "40"} 

then have file index.html supposed read values of io.html each second , enter values in input fields in index.html:

<html>     <head>         <script>             ajax = {                 getxmldoc: function(){return ((window.xmlhttprequest) ? new xmlhttprequest() : new activexobject("microsoft.xmlhttp"))},                  //u:= url, f:= callback                 get: function(u, f){                     var tdoc = this.getxmldoc();                      tdoc.open('get', u, true);                     tdoc.onreadystatechange = function(){                         if (tdoc.readystate === xmlhttprequest.done && tdoc.status === 200) f(tdoc);                     };                      tdoc.send();                 }             };         </script>          <script type = 'text/javascript'>             function starttimer(){                 document.body.qq = setinterval(function(){                     ajax.get('io.html', function(r){                         var tr = eval('[' + r.response + ']')[0]; //this our json object of io.html (:= {"var1": "30", "var2": "40"})                          //now loop values/key in our json , add input id (:= var1, var2)                         for(var k in tr){                             //we input same id key..                             //we create them on fly.                             var te = document.getelementbyid(k);                             if (te) te.value = tr[k];                         }                     })                 }, 1000)             }         </script>     </head>      <body onload = 'starttimer()'>         <input type = 'text' id = 'var1' name = 'c1-cycle' />         <input type = 'text' id = 'var2' name = 'c2-cycle' />     </body> </html> 

so load index.html , each second gets new values io.html , updates values of io.html in input fields of index.html.

why same code fiddle works in fiddle yet not on server not able tell you. path wrong or includes missing. aware locally not able access "/echo/js/?js={"var1": "30", "var2": "40"}".

here futher example placeholder , iframe. first io.html updates every second via meta refresh:

<html>     <head>         <meta http-equiv = 'refresh' content = '5'>     </head>      <body>         <input type = 'text' value = ':="datablock".counter:' />     </body </html> 

and index.html containing io.html in iframe:

<html>     <head></head>      <body>         <iframe src = 'io.html'></iframe>     </body> </html> 

Comments