Jump to content

s_avinash_s

Members
  • Posts

    121
  • Joined

  • Last visited

Posts posted by s_avinash_s

  1. Hi

    My current code which i tried with  document.querySelector is below.

    The contents in temp1 to temp8 should be visible only when correct user is logged in.

    Each user has its own priority and some tabs are disabled for some users.

     

    <form class ="language_home" action="/passwordcheck.txt" method="post">
             
    
                           Login: <select name='userchoice'  >
                              <option value="1">User</option>
                              <option value="2">Supervisor</option>
                              <option value="3">Admin</option>
                              <option value="4">Service</option>
                            </select>
                        Password:
                         <input type="password" name="pwd" >
                         <button  id="log">Login</button><br/><br/><br/>
                        </form>
      <script>
          var user_login;
    	  var supervisor_login;
    	  var admin_login;
    	  var service_login;
    
    function newfun(){  
    	var btn=document.querySelector('#temp1a');
      btn.onclick=flva;
      
      var btn1=document.querySelector('#temp2a');
      btn1.onclick=stgt;
      
      var btn2=document.querySelector('#temp3a');
      btn2.onclick=prvar;
      
      var btn3=document.querySelector('#temp4a');
      btn3.onclick=tot;
      
      var btn4=document.querySelector('#temp5a');
      btn4.onclick=inot;
      
      var btn5=document.querySelector('#temp6a');
      btn5.onclick=comsg;
      
      var btn6=document.querySelector('#temp7a');
      btn6.onclick=caltn;
      
      var btn7=document.querySelector('#temp8a');
      btn7.onclick=dgst;
     }
    	  
    function func()
    {
    	document.getElementById('id01').style.display='block';
    }
    function flva()
    {
    	if((user_login == 1)||(supervisor_login==1)||(admin_login==1)||(service_login==1))
    	{
    		aler("success");
    		openCity(event, 'temp1');
    	}
    	else
    	{
    			func();
    	}
    }
    
    function stgt()
    {
    	if((user_login == 1)||(supervisor_login==1)||(service_login==1))
    	{
    		openCity(event, 'temp2');
    	}
    	else
    	{
    			func();
    	}
    }
    function prvar()
    {
    	if((user_login == 1)||(supervisor_login==1)||(service_login==1))
    	{
    		openCity(event, 'temp3');
    	}
    	else
    	{
    			func();
    	}
    }
    function tot()
    {
    	if((user_login == 1)||(supervisor_login==1)||(service_login==1))
    	{
    		openCity(event, 'temp4');
    	}
    	else
    	{
    			func();
    	}
    }
    function inot()
    {
    	if((user_login == 1)||(supervisor_login==1)||(service_login==1))
    	{
    		openCity(event, 'temp5');
    	}
    	else
    	{
    			func();
    	}
    }
    function comsg()
    {
    	if((user_login == 1)||(admin_login==1)||(service_login==1))
    	{
    		openCity(event, 'temp6');
    	}
    	else
    	{
    			func();
    	}
    }
    function caltn()
    {
    	if((user_login == 1)||(admin_login==1)||(service_login==1))
    	{
    		openCity(event, 'temp7');
    	}
    	else
    	{
    			func();
    	}
    }
    function dgst()
    {
    	if((user_login == 1)||(admin_login==1)||(service_login==1))
    	{
    		openCity(event, 'temp8');
    	}
    	else
    	{
    			func();
    	}
    }
        function user_option() {
    
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) 
    		{
                user_login=parseInt(this.responseText);
            }
          };
        xhttp.open("GET", "user_login.txt", true);
        xhttp.send();
        }
    
        setInterval(user_option, 1000);
    
    
    
              
        function supervisor_option() {
    
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) 
    		{
                supervisor_login=parseInt(this.responseText);
            }
          };
        xhttp.open("GET", "supervisor_login.txt", true);
        xhttp.send();
        }
    
        setInterval(supervisor_option, 1000);
    
    
                  
        function admin_option() {
    
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) 
    		{
                admin_login=parseInt(this.responseText);
            }
          };
        xhttp.open("GET", "admin_login.txt", true);
        xhttp.send();
        }
    
        setInterval(admin_option, 1000);
    
    
    
      
        function service_option() {
    
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) 
    		{
                service_login=parseInt(this.responseText);
            }
          };
        xhttp.open("GET", "service_login.txt", true);
        xhttp.send();
        }
    
        setInterval(service_option, 1000);
    
      </script>
    
    
    
    
        <style>
         {
        font-family: Arial;
        overflow:auto;
        }
    
        /* Style the tab */
        .tab {
            overflow: hidden;
            border: 1px solid #fff;
            background-color: #f1f1f1;
        }
    
        /* Style the buttons inside the tab */
        .tab button {
            background-color: inherit;
            float: left;
            border: none;
            outline: none;
            cursor: pointer;
            padding: 14px 55px;
            transition: 0.3s;
            font-size: 20px;
        }
    
        /* Change background color of buttons on hover */
        .tab button:hover {
            background-color: #ddd;
        }
    
        /* Create an active/current tablink class */
        .tab button.active {
            background-color: #888;
        }
    
        /* Style the tab content */
        .tabcontent {
            display: none;
            padding: 6px 12px;
            border: 0px solid #fff;
            border-top: none;
        }
        </style>
    
    
      <!--  <body bgcolor="#5DADE2  ">-->
    
        <div class="tab">
          <button class="tablinks" id="temp1a" onclick="newfun()">temp1</button>
          <button class="tablinks" id="temp2a" onclick="newfun()">temp2</button>
          <button class="tablinks" id="temp3a" onclick="newfun()">temp3</button>
          <button class="tablinks" id="temp4a" onclick="newfun()">temp4</button>
          <button class="tablinks" id="temp5a" onclick="newfun()">temp5</button>
          <button class="tablinks" id="temp6a" onclick="newfun">temp6</button>
          <button class="tablinks" id="temp7a" onclick="newfun">temp7</button>
          <button class="tablinks" id="temp8a" onclick="newfun">temp8</button>
        </div>
    
        <div id="temp1" class="tabcontent">
        <select>
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
      <option value="opel">Opel</option>
      <option value="audi">Audi</option>
    </select>
        </div>
        
       <div id="temp2" class="tabcontent">
        <form>
      <input type="radio" name="gender" value="male" checked> Male<br>
      <input type="radio" name="gender" value="female"> Female<br>
      <input type="radio" name="gender" value="other"> Other  
    </form> 
       </div>
        
        
       <div id="temp3" class="tabcontent">
        <form action="/temp3.txt" method="get" id="nameform">
      First name: <input type="text" name="fname"><br>
      Last name: <input type="text" name="lname"><br>
    </form>
    
    <button type="submit" form="nameform" value="Submit">Submit</button>
    
        </div>
        
        
        <div id="temp4" class="tabcontent">
        <textarea rows="4" cols="50">
        This is text area
        </textarea>
        </div>
        
        <div id="temp5" class="tabcontent">
        <b> examples1 </b>
        </div>
        
        
        <div id="temp6" class="tabcontent">
        <b> examples </b>
        </div>
        
        
        <div id="temp7" class="tabcontent">
            <form action="/temp7.txt" method="get" id="nameform">
      First name: <input type="text" name="fname"><br>
      Last name: <input type="text" name="lname"><br>
    </form>
    
    <button type="submit" form="nameform" value="Submit">Submit</button>
        </div>
        
        <div id="temp8" class="tabcontent">
            <textarea rows="4" cols="50">
        This is text area
        </textarea>
        </div>
        
            <script>
    
    var tablinks = document.getElementsByClassName("tablinks");
          var tabcontent = document.getElementsByClassName("tabcontent");
          if (localStorage.activeLI) {
                        tablinks[localStorage.activeLI].className += " active";
                       tabcontent[localStorage.activeLI].style.display = "block";
                    }
    
    
    function openCity(evt, cityName) {
            var i;
    
            for (i = 0; i < tabcontent.length; i++) {
                tabcontent[i].style.display = "none";
            }
    
            for (i = 0; i < tablinks.length; i++) {
                tablinks[i].className = tablinks[i].className.replace(" active",
    "");
            }
            document.getElementById(cityName).style.display = "block";
            evt.currentTarget.className += " active";
    
             for (i = 0; i < tablinks.length; i++) {
    
                  if (tablinks[i].className.indexOf("active") !== -1) {
                        localStorage.activeLI = i;
                  }
            }
    
    
        }
              </script>
        
        

     

  2. Hi

    I tried with following example

    var btn = document.querySelector('button'); function bgChange() { var rndCol = 'rgb(' + random(255) + ',' + random(255) + ',' + random(255) + ')'; document.body.style.backgroundColor = rndCol; } btn.addEventListener('click', bgChange);

    but still its same.

    If i give user_login=1 in html file it works fine.

    Please help am not exactly getting what is the issue

  3. Hi

    Below is my source code.Is there any mismatch between the calling function and function definition.

    Please suggest

    <form class ="language_home" action="/passwordcheck.txt" method="post">
             
    
                           Login: <select name='userchoice'  >
                              <option value="1">User</option>
                              <option value="2">Supervisor</option>
                              <option value="3">Admin</option>
                              <option value="4">Service</option>
                            </select>
                        Password:
                         <input type="password" name="pwd" >
                         <button  id="log">Login</button><br/><br/><br/>
                        </form>
      <script>
          var user_login;
    	  var supervisor_login;
    	  var admin_login;
    	  var service_login;
    	  var a;
    	  var b;
    	  var c;
    	  var d;
    	  var tablinks = document.getElementsByClassName("tablinks");
          var tabcontent = document.getElementsByClassName("tabcontent");
          if (localStorage.activeLI) {
                        tablinks[localStorage.activeLI].className += " active";
                       tabcontent[localStorage.activeLI].style.display = "block";
                    }
    
    
    function openCity(evt, cityName) {
            var i;
    
            for (i = 0; i < tabcontent.length; i++) {
                tabcontent[i].style.display = "none";
            }
    
            for (i = 0; i < tablinks.length; i++) {
                tablinks[i].className = tablinks[i].className.replace(" active",
    "");
            }
            document.getElementById(cityName).style.display = "block";
            evt.currentTarget.className += " active";
    
             for (i = 0; i < tablinks.length; i++) {
    
                  if (tablinks[i].className.indexOf("active") !== -1) {
                        localStorage.activeLI = i;
                  }
            }
    
    
        }
    function func()
    {
    	document.getElementById('id01').style.display='block';
    }
    function flva()
    {   
       if(a == 1 || b == 1 || c == 1 || d == 1) {
       openCity(event, 'temp1');
    } 
    else 
    {
      func();
    }
    }
    
    function stgt()
    {
    	if(a == 1 || b == 1 || c == 1 || d == 1) {
       openCity(event, 'temp2');
    } 
    else 
    {
      func();
    }
    }
    function prvar()
    {   
        	if(a == 1 || b == 1 || c == 1 || d == 1) {
            openCity(event, 'temp3');
    } 
    else 
    {
      func();
    }
        
        
    }
    function tot()
    {
    
    	if(a == 1 || b == 1 || c == 1 || d == 1) {
            openCity(event, 'temp4');
    } 
    else 
    {
      func();
    }
    }
    function inot()
    {
    
    		if(a == 1 || b == 1 || c == 1 || d == 1) {
            openCity(event, 'temp5');
    } 
    else 
    {
      func();
    }
    }
    function comsg()
    {
    		if(a == 1 || b == 1 || c == 1 || d == 1) {
            openCity(event, 'temp6');
    } 
    else 
    {
      func();
    }
    
    }
    function caltn()
    {
        
        if(a == 1 || b == 1 || c == 1 || d == 1) {
            openCity(event, 'temp7');
    } 
    else 
    {
      func();
    }
    }
    
    
    function dgst()
    {
    
    	    if(a == 1 || b == 1 || c == 1 || d == 1) {
            openCity(event, 'temp8');
    } 
    else 
    {
      func();
    }
    }
        function user_option() {
    
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) 
    		{
                user_login=parseInt(this.responseText);
    			if(user_login==1)
    			{
    				a=1;
    			}
    			else
    			{
    				a=0;
    			}
            }
          };
        xhttp.open("GET", "user_login.txt", true);
        xhttp.send();
        }
    
        setInterval(user_option, 1000);
    
    
    
              
        function supervisor_option() {
    
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) 
    		{
                supervisor_login=parseInt(this.responseText);
    			if(supervisor_login==1)
    			{
    				b=1;
    			}
    			else
    			{
    				b=0;
    			}
    			
            }
          };
        xhttp.open("GET", "supervisor_login.txt", true);
        xhttp.send();
        }
    
        setInterval(supervisor_option, 1000);
    
    
                  
        function admin_option() {
    
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) 
    		{
                admin_login=parseInt(this.responseText);
    			if(admin_login==1)
    			{
    				c=1;
    			}
    			else
    			{
    				c=0;
    			}
            }
          };
        xhttp.open("GET", "admin_login.txt", true);
        xhttp.send();
        }
    
        setInterval(admin_option, 1000);
    
    
    
      
        function service_option() {
    
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) 
    		{
                service_login=parseInt(this.responseText);
    			if(service_login==1)
    			{
    				d=1;
    			}
    			else
    			{
    				d=0;
    			}
            }
          };
        xhttp.open("GET", "service_login.txt", true);
        xhttp.send();
        }
    
        setInterval(service_option, 1000);
    
      </script>
    

     

  4. Hi

    4 statements i have modified as mentioned.

    event is used in tabs script

    <script>
    function openCity(evt, cityName) {
        var i, tabcontent, tablinks;
        tabcontent = document.getElementsByClassName("tabcontent");
        for (i = 0; i < tabcontent.length; i++) {
            tabcontent[i].style.display = "none";
        }
        tablinks = document.getElementsByClassName("tablinks");
        for (i = 0; i < tablinks.length; i++) {
            tablinks[i].className = tablinks[i].className.replace(" active", "");
        }
        document.getElementById(cityName).style.display = "block";
        evt.currentTarget.className += " active";
    }
    </script>

    But i dont understand why this function call is not execuitng

  5. Hi

    Just got some idea about json objects

    <p id="demo"></p>
    
    <script>
    var myObj, x;
    myObj = {"name":"John", "age":30, "car":null};
    x = myObj.name;
    document.getElementById("demo").innerHTML = x;
    </script>

    but in ajax am receiving data till now as below

    if (this.readyState == 4 && this.status == 200) {
    	      document.getElementById("demo2").innerHTML = this.responseText;
    }

    Now how to get data through ajax and json object.

    My plan is to receive like below

    
     else if ((NX_HTTP_SERVER_GET_REQUEST == request_type) && (0 == strcmp (resource, "/tab1")))
        {
    		while(i  <  number)
            {
                    memset (g_str_buf, 0, sizeof(g_str_buf));
                    snprintf (g_str_buf, STR_BUFFER_LEN, "%s", variable[number]);
                    nx_http_server_callback_data_send (server_ptr, g_str_buf, sizeof (tab1));
                    return (NX_HTTP_CALLBACK_COMPLETED);
            }
        }

    How to get it , still its not clear to me

  6. Hi 

    Function call is not happening.

    i have 7 tabs in my code based on following example https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_tabs

    Before the tabs are created i have a common section in my web page where it is accessible from any tab.I mean after this  section, tabs code comes.

    So before tabs code is called am calling a function

    function openCity(evt, cityName)

    which uses script of tabs code

    but that script is not being called.

    My code where function call is not executing is

    function def()
    {
    	if(temp1 == 1)
    	{
    		openCity(event, 'temperature');
    	}
    	else if(temp2 == 1)
    	{
    			openCity(event, 'temperature');
    	}
    	else if(temp3 == 1)
    	{
    		openCity(event, 'temperature');
    	}
    	else if(temp4 == 1)
    	{
    		openCity(event, 'temperature');
    	}
    	else
    	{
    			func();
    	}
    }

    In above code, temperature is a tab name which should open that tab only when the above conditions satisfy but it does not work.

    Any thing wrong with my call

  7. On 11/7/2018 at 5:42 PM, s_avinash_s said:

    else if ((NX_HTTP_SERVER_GET_REQUEST == request_type) && (0 == strcmp (resource, "/tab1"))) { memset (g_str_buf, 0, sizeof(g_str_buf)); snprintf (g_str_buf, STR_BUFFER_LEN, "%d", temp_val); nx_http_server_callback_data_send (server_ptr, g_str_buf, sizeof (tab1)); return (NX_HTTP_CALLBACK_COMPLETED); }

    Hi

     

    From above i am planning to get whole data to web page( i need to test).

    Once i get whole data to web page, how to place each data in its specified location in web page

     

  8. Hi

    Usually i use ajax to get data every 1 sec for a particular variable as shown below and call that function using setInterval.

        <p class = "modify" id="demo11"></p>
        <script>
        function temp_val() {
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
              document.getElementById("demo11").innerHTML = this.responseText;          
            }
          };
        xhttp.open("GET", "temp_val", true);
        xhttp.send();
        }
    
        setInterval(temp_val, 1000);
        </script>

    For tab creation , i followed a example from https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_tabs

    Onclick functionality if i use, then i send to server with that tab name ,..example tab1

    xhttp.open("GET", "tab1", true);

    and from server all the variables of that tab can be placed and receives at web page.Some thing similar to below if i use

        else if ((NX_HTTP_SERVER_GET_REQUEST == request_type) && (0 == strcmp (resource, "/tab1")))
        {
            memset (g_str_buf, 0, sizeof(g_str_buf));
            snprintf (g_str_buf, STR_BUFFER_LEN, "%d", temp_val);
            nx_http_server_callback_data_send (server_ptr, g_str_buf, sizeof (tab1));
            return (NX_HTTP_CALLBACK_COMPLETED);
        }

    How to differentiate and keep each variable in required text box after reeving since i will be having a 50 to 100 variables update.

     

    Hope you have understood my requirement

  9. 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>

     

  10. 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>

     

  11. Hi 

    I have 7 to 8 tabs in my code and interacting to server using ajax for getting dynamic data every 1 sec.

    Since am requesting  more data every 1 sec it is slowing down the content and it lags.

    So is it possible to update only that tab which user clicks.I mean among 7 to 8 tabs user cant view all tabs at the same time.

    So he views one by one based on his requirement.

    So how to make only the clicked tab to get dynamic data.

    Please suggest

     

  12. Hi 

    I am trying to print the value in textbox which is selected from dropdown.

    First 2 drop down values am able to print in text box as it is static value.

    For third value  , am getting from server.

     how should i print the third after receiving from server.

    <!DOCTYPE html>
    <html>
    <body>
    
    <select onchange="Choose(this)" >
      <option value="2" >temp1</option>
      <option value="22" >temp2</option>
      <option value="temp3">temp3</option>
      <option value="temp4" >temp4</option>
    </select>
    <input type="text" id="answer" >
    
    
    <script>
    function Choose(data) {
       
        document.getElementById ("answer").value = data.value;
    }
    
    function absolute() {
    
          var xhttp = new XMLHttpRequest();
          xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) { 
    	      document.getElementById("demo2").innerHTML = this.responseText;        
            }
          };
        xhttp.open("GET", "absolute", true);
        xhttp.send();
        }
    
        setInterval(absolute, 1000);
    </script>
    
    
     <p  id="demo2"></p>
    
    
    </body>
    </html>

     

  13. 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>

     

  14. 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>

     

×
×
  • Create New...