Skip to main content

How to Refresh/Reload a Page frequently or periodically

We can automatically webpage refresh/ reload with two ways. one of them is using HTML Meta Tag and another is Javascript. in this tutorial you can learn both technique.

Using Meta Tag

<!DOCTYPE html>
<html class="k-ff k-ff43">
 <head> 
  <meta http-equiv="refresh" content="10" />   
 </head>
 <body>
  <div class="refressData" style="border: 2px dotted red; margin-top:40px;"  id="refressData">
 </div>
  
 <script>

     $(document).ready(function () {

         var dateTime = 'Date: ' + new Date().getDate() + '/' + new Date().getMonth() + '/' + new Date().getFullYear() + '/' + ' Time: ' + new Date().getHours() + ": " + new Date().getMinutes() + ':' + new Date().getSeconds();
         $("#refressData").append(dateTime);

     })
</script>
</html>

META Tag:

 <meta http-equiv="refresh" content="10" />  

Add tag in header section and content give value will be parse as second. Metadata is data (information) about data.The <meta> tag provides metadata about the HTML document. Metadata will not be displayed on the page, but will be machine parsable. Meta elements are typically used to specify page description, keywords, author of the document, last modified, and other metadata. Metadata is always passed as name/value pairs.

Script: This script allow to get datetime during page reload and append to div


 $(document).ready(function () {

               var dateTime = 'Date: ' + new Date().getDate() 
                    + '/' + new Date().getMonth() + '/' + new Date().getFullYear() 
                    + '/' + ' Time: ' + new Date().getHours() 
                    + ": " + new Date().getMinutes() + ':' + new Date().getSeconds();
               $("#refressData").append(dateTime);

           })

Using Only Javascript


<!DOCTYPE html>
<html class="k-ff k-ff43">
       <head>          
               <title>
                               Automatically webpage refresh/ reload
               </title>       
       </head>
       <body>
              <div class="refressData" style="border: 2px dotted red; margin-top:40px;"  id="refressData">
              </div>
       </body>
      
       <script>

           $(document).ready(function () {
               var dateTime = 'Date: ' + new Date().getDate() + '/'
                + new Date().getMonth() + '/' + new Date().getFullYear()
                + '/' + ' Time: ' + new Date().getHours() + ": "
                + new Date().getMinutes() + ':' + new Date().getSeconds();
               $("#refressData").append(dateTime);
           })

           setTimeout(function () {
               window.location.reload(true);
           }, 5000);
</script>
</html

Script: using setTimeout Javascript function call window reload method


window.location.reload(true);
Automatically Page reload


Labels:

Comments

Post a Comment

Popular posts from this blog

Database View

View is a database object also called a logical table. it has no psychical existence. It is not like a simple table, but is a virtual or logical table which contains columns and data from different tables (may be one or more tables). A View does not contain any data, it is a set of queries that are applied to one or more tables that is stored within the database as an object. After creating a view from some table(s), it used as a reference of those tables and when executed, it shows only those data which are already mentioned in the query during the creation of the View. Creating view Syntax: ------------------------------------------------- CREATE VIEW [View_Name] AS [ SELECT Statement] ------------------------------------ ------------- CREATE VIEW SampleView As SELECT EmpID, EmpName FROM EmpInfo -------------------------------------------------- Data retrieve from view: SELECT * FROM SampleView WHERE EmpID ='FN0009C1'     View does not modif
Post a Comment
Read more

Efficiently Paging Through Large Amounts of Data (PageIndex, Page Size) -SQL Server

In this article you learn how to fetch data according PageIndex and PageSize. In web application, it is much more important to increase webform performance, loadbalance. In my development experience, some of table hold large amount of records (more than 2GB) and user need to shows records in GridView. But problem is when we select all records and loads in webforms, webform has crashed. In that case, I will simply solved with Table Variable and using Grid Page Number and Page Size. 1. Create Procedure CREATE PROCEDURE Load_Data_WithPaging @PageIndex AS INT , /*Selected Row Index of selected grid*/ @PageSize AS INT , /*Total page size of selected grid*/ @TotalRecords AS INT OUT /*used for display virtual page no*/ AS BEGIN SET NOCOUNT ON ; DECLARE @FromIndex AS INT = 0 , @ToIndex AS INT = 0 ; SET @FromIndex = (@PageIndex * @PageSize) + 1 ; /*First row no selection*/ SET @ToIndex = ((@PageIndex
Post a Comment
Read more

What is an Index? Explain Custered Index and Non-Clustered Index

Index Index is a database object, which can be created on one or more columns (16 Max column combination). When creating the index will read the column(s) and forms a relevant data structure to minimize the number of data comparisons. The index will improve the performance of data retrieval and adds some overhead on data modification such as create, delete and modify. So it depends on how much data retrieval can be performed on table versus how much of DML ( Insert , Delete and Update ) operations. clustered index A clustered index is something that reorganizes the way records in the table are physically stored. Therefore a table can have only one clustered index. The leaf nodes of a clustered index contain the data pages, by which I mean the key-value pair in the clustered index has the index key and the actual data value. Also remember, a clustered index will be created on a table by default the moment a primary key is created on the table. A clustered index is so
Post a Comment
Read more