s_avinash_s Posted November 2, 2018 Share Posted November 2, 2018 Hi I am trying to use onload event, but it is not working. i will receive value from document.getElementById("hw_maj").value = this.responseText; any issue with my code. <p id="hw_maj"></p> <body onload="hw_major()"> </body> <script> function hw_major() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("hw_maj").value = this.responseText; document.getElementById("myText_hw_maj").value = this.responseText; } }; xhttp.open("GET", "hw_ver.txt", true); xhttp.send(); } </script> <h3>HW version: <input type="text" id="myText_hw_maj" size ="10" style="border:none;font-size:27pt;"></h3> Link to comment Share on other sites More sharing options...
Ingolme Posted November 2, 2018 Share Posted November 2, 2018 Paragraphs do not have a value attribute, only form elements do. Use innerHTML instead. Link to comment Share on other sites More sharing options...
s_avinash_s Posted November 2, 2018 Author Share Posted November 2, 2018 (edited) Hi it works...Thanks But i need to get the value in my text box only other than directly printing Edited November 2, 2018 by s_avinash_s Link to comment Share on other sites More sharing options...
Ingolme Posted November 2, 2018 Share Posted November 2, 2018 Is it not doing that? Link to comment Share on other sites More sharing options...
s_avinash_s Posted November 2, 2018 Author Share Posted November 2, 2018 (edited) Hi when i use it prints on both.... I need only on text box document.getElementById("hw_maj").innerHTML = this.responseText; document.getElementById("myText_hw_maj").innerHTML = this.responseText; and <input type="text" id="myText_hw_maj" size ="10" style="border:none;font-size:27pt;"></h3> But if use, it prints only in textbox but occupies..i need to avoid it if (this.readyState == 4 && this.status == 200) { document.getElementById("hw_maj").innerHTML = this.responseText; document.getElementById("hw_maj").style.visibility = "hidden"; } }; xhttp.open("GET", "hw_ver.txt", true); xhttp.send(); } </script> <h3>HW version: <input type="text" id="hw_maj" size ="10" style="border:none;font-size:27pt;"></h3> Edited November 2, 2018 by s_avinash_s Link to comment Share on other sites More sharing options...
Ingolme Posted November 2, 2018 Share Posted November 2, 2018 If you don't need it in the paragraph element, then remove the line of code that does that. Just delete this line, but keep all the rest of the code the same: document.getElementById("hw_maj").innerHTML = this.responseText; You need to understand what each line of code is doing. You should also delete that <p> element from your HTML since you're not using it. Link to comment Share on other sites More sharing options...
s_avinash_s Posted November 4, 2018 Author Share Posted November 4, 2018 Hi I have a code where 3 onload functions are being used. but only first one displays in text box and other 2 not displaying. I am not getting what is wrong <body onload="abc()"> </body> <script> function abc() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("temp1").value = this.responseText; } }; xhttp.open("GET", "temp1", true); xhttp.send(); } </script> <br> <br> <h3>SW version: <input type="text" id="temp1" size ="10" style="border:none;font-size:27pt;"></h3> <body onload="def()"> <script> function def() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("temp2").value = this.responseText; } }; xhttp.open("GET", "temp2", true); xhttp.send(); } </script> </body> <h3>HW version: <input type="text" id="temp2" size ="10" style="border:none;font-size:27pt;"></h3> <br> <body onload="ghi()"> </body> <script> function ghi() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("temp3").value = this.responseText; } }; xhttp.open("GET", "temp3", true); xhttp.send(); } </script> <h3>Version Info: <input type="text" id="temp3" size ="10" style="border:none;font-size:27pt;"></h3> <br> Link to comment Share on other sites More sharing options...
Ingolme Posted November 4, 2018 Share Posted November 4, 2018 You cannot have more than one <body> tag in the document and all of the page's content must be inside that <body> tag. You should use addEventListener if you need more than one function to run when the window loads. Link to comment Share on other sites More sharing options...
s_avinash_s Posted November 4, 2018 Author Share Posted November 4, 2018 Hi Thanks for the info. I got some info about addeventlistener and tried the following code. when i click button it displays the value. Without clicking, is it possible to load the value only once. <!DOCTYPE html> <html> <body> <button id="myBtn">Try it</button> <p id="demo"> <script> var x=100; document.getElementById("myBtn").addEventListener("click", myFunction); function myFunction() { document.getElementById("demo").innerHTML = x; } </script> </body> </html> Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now