s_avinash_s Posted October 8, 2018 Share Posted October 8, 2018 Hi I have a option of 8 errors in my web page. Whenever the latest error comes it should be at the top of list, the one which was earlier at top should shift to next line. the second line error should shift to third line and so on. Is there any idea to proceed with this or an example ? Link to comment Share on other sites More sharing options...
Ingolme Posted October 8, 2018 Share Posted October 8, 2018 What code is putting the errors onto the page? Link to comment Share on other sites More sharing options...
JMRKER Posted October 9, 2018 Share Posted October 9, 2018 Since you choose to provide no code, you get a SWAG. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title> Simulated Errors </title> <!-- link rel="stylesheet" href="common.css" media="screen" --> </head> <body> <h2> Simulated errors </h2> <div id="simErrors"> <label> <input type="radio" name="rbtn" value="1"> Error 1 </label> <label> <input type="radio" name="rbtn" value="2"> Error 2 </label> <label> <input type="radio" name="rbtn" value="3"> Error 3 </label> <label> <input type="radio" name="rbtn" value="4"> Error 4 </label> <label> <input type="radio" name="rbtn" value="5"> Error 5 </label> <label> <input type="radio" name="rbtn" value="6"> Error 6 </label> <label> <input type="radio" name="rbtn" value="7"> Error 7 </label> <label> <input type="radio" name="rbtn" value="8"> Error 8 </label> </div> <h3>Last 10 Error List</h3> <pre id="errList"></pre> <script> var errs = []; function add2errs(info) { // alert(info.value); errs.unshift('Error: '+info.value); if (errs.length > 10) { errs.length = 10; } document.getElementById('errList').innerHTML = errs.join('\n'); } function init() { var sel = document.querySelectorAll('#simErrors input'); for (let i=0; i<sel.length; i++) { sel[i].addEventListener('click', function () { add2errs(this); } ); } } init(); </script> </body> </html> Link to comment Share on other sites More sharing options...
Ingolme Posted October 9, 2018 Share Posted October 9, 2018 I would sooner use the insertBefore() method so as to not change so much of the DOM at once. Link to comment Share on other sites More sharing options...
s_avinash_s Posted October 9, 2018 Author Share Posted October 9, 2018 Hi I will be getting the data every 5 seconds using ajax. whenever error data comes i need to display it . So using insertbefore() or the code above mentioned will be fine but with little modifications. 1. In above code, instead of radio buttons, Whichever error data comes i need to display.how to do it please suggest 2.I have tried with insertbefore() https://www.w3schools.com/code/tryit.asp?filename=FW30QQZS675R Here i need to limit the data to 8. also how to get the value using ajax and display instead of water as being displayed Link to comment Share on other sites More sharing options...
dsonesuk Posted October 9, 2018 Share Posted October 9, 2018 How would that be helpful? If you limit to 8 and stop the script, you lose getting current errors If you limit to 8 showing, you lose knowledge of any errors that occurred previously as it continuously updates every 5 sec. Link to comment Share on other sites More sharing options...
JMRKER Posted October 9, 2018 Share Posted October 9, 2018 Replace the "Simulated events" with the actual event logic regardless of where they came from. You have provided no code for me to give suggestions about. Use the function "add2errs" logic to limit your list display to any number of errors desired. The error information is just saved to an array which you control the display to the max desired. You could also save ALL errors and just display only the last 8 received. Link to comment Share on other sites More sharing options...
s_avinash_s Posted October 10, 2018 Author Share Posted October 10, 2018 Hi Dsonesuk and JMRKER Thanks for the reply. My code is as below <p class = "modify" id="error_pos1"></p> <p class = "modify" id="error_pos2"></p> <p class = "modify" id="error_pos3"></p> <p class = "modify" id="error_pos4"></p> <p class = "modify" id="error_pos5"></p> <p class = "modify" id="error_pos6"></p> <p class = "modify" id="error_pos7"></p> <p class = "modify" id="error_pos8"></p> <script> function error_1() { var x1; var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if(xhttp.readyState == 4) { if(xhttp.status == 0) { } else { x1 = this.responseText; if (x1 == 0 ) { document.getElementById("error_pos1").innerHTML = "Error for temp1"; } } } }; xhttp.open("GET", "error_val1.txt", true); xhttp.send(); } setInterval(error_1(), 5000); function error_2() { var x2; var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if(xhttp.readyState == 4) { if(xhttp.status == 0) { } else { x2 = this.responseText; if (x2 == 0 ) { document.getElementById("error_pos2").innerHTML = "Error for temp2"; } } } }; xhttp.open("GET", "error_val2.txt", true); xhttp.send(); } setInterval(error_2(), 5000); ...... actually am monitoring the error case every 5 seconds through ajax. And also here i have mainly x2 = this.responseText; if (x2 == 0 ) { document.getElementById("error_pos2").innerHTML = "Time Not Set"; } else part am not checking.only if it goes inside this condition then only Error should appear on first line. Similarly for all the 8 errors also. Which ever error is latest, it should be displayed on first line and others should be moved down. Please suggest how to do it Link to comment Share on other sites More sharing options...
JMRKER Posted October 11, 2018 Share Posted October 11, 2018 You have 8 (!) repeated code for an AJAX file access. Seems very wasteful code. I don't have access to a server to test your code and it does not run locally. Do you have it online somewhere? Why are you using 8 (!) paragraph elements to display the error information when 'dsonesuk' and I have suggested workable alternatives? Link to comment Share on other sites More sharing options...
s_avinash_s Posted October 11, 2018 Author Share Posted October 11, 2018 Hi My code i have kept in https://www.w3schools.com/code/tryit.asp?filename=FW56M9QG79H1 I need to get a continuous data from server and update it, so i am using AJAX. If the code enters error condition, then only fresh error should be displayed on first line else previous error will be on first line. when fresh error is on first line , other error should shift to second line and so on till 5 errors.(only 5 errors are required). It is like bottleneck for me, please help Link to comment Share on other sites More sharing options...
dsonesuk Posted October 11, 2018 Share Posted October 11, 2018 (edited) "who's on first, what's on second, I Don't Know is on third" https://www.youtube.com/watch?v=kTcRRaXV-fg Edited October 11, 2018 by dsonesuk 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