{"id":16439,"date":"2020-07-19T04:02:33","date_gmt":"2020-07-19T04:02:33","guid":{"rendered":"https:\/\/www.devopsschool.com\/blog\/?p=16439"},"modified":"2022-04-13T15:56:37","modified_gmt":"2022-04-13T15:56:37","slug":"how-to-do-auto-load-and-refresh-div-every-seconds-with-jquery-and-ajax-with-php-script","status":"publish","type":"post","link":"https:\/\/www.devopsschool.com\/blog\/how-to-do-auto-load-and-refresh-div-every-seconds-with-jquery-and-ajax-with-php-script\/","title":{"rendered":"How to do Auto Load and Refresh  Div every Seconds with jQuery and Ajax with PHP Script."},"content":{"rendered":"\n<p>In this tutorial we are going to learn how to do auto load and refresh div every second by using JQuery and Ajax method with PHP Script. In this tutorial we will first Insert form data into Mysql table by using Ajax Jquery method in PHP. After Inserting data into database then after by using Jquery <strong>load()<\/strong> method which fetch data from database. Then after this <strong>load()<\/strong> method has been used in Jquery <strong>setInterval()<\/strong>, this method will execute <strong>load()<\/strong> method on regular interval until we have called <strong>clearInterval()<\/strong>. So this way we can Auto load and refresh div content on every predefine interval with Jquery and Ajax.<\/p>\n\n\n\n<p><strong>index.php<\/strong><\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/amardeep18\/c5aabff253f400e7046289b83ca17d39.js\"><\/script>\n\n\n\n<p><strong>post.php<\/strong><\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/amardeep18\/24fcf2fde2c1a0c21e73b940e0289a17.js\"><\/script>\n\n\n\n<p><strong>display.php<\/strong><\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/amardeep18\/285a65bd4f410f870753b7d58dbe9f58.js\"><\/script>\n\n\n\n<p><strong>tbl_post.sql<\/strong><\/p>\n\n\n\n<script src=\"https:\/\/gist.github.com\/amardeep18\/02f610ec22545d4ac5b65d3bea2a2d41.js\"><\/script>\n\n\n<div class=\"epyt-gallery\" data-currpage=\"1\" id=\"epyt_gallery_65198\"><iframe loading=\"lazy\"  id=\"_ytid_81585\"  width=\"760\" height=\"427\"  data-origwidth=\"760\" data-origheight=\"427\" src=\"https:\/\/www.youtube.com\/embed\/?enablejsapi=1&#038;autoplay=0&#038;cc_load_policy=0&#038;cc_lang_pref=&#038;iv_load_policy=1&#038;loop=0&#038;rel=1&#038;fs=1&#038;playsinline=0&#038;autohide=2&#038;theme=dark&#038;color=red&#038;controls=1&#038;disablekb=0&#038;\" class=\"__youtube_prefs__  no-lazyload\" title=\"YouTube player\"  data-epytgalleryid=\"epyt_gallery_65198\"  allow=\"fullscreen; accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen data-no-lazy=\"1\" data-skipgform_ajax_framebjll=\"\"><\/iframe><div class=\"epyt-gallery-list\"><div>Sorry, there was a YouTube error.<\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>In this tutorial we are going to learn how to do auto load and refresh div every second by using JQuery and Ajax method with PHP Script. In this tutorial&#8230; <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_joinchat":[],"footnotes":""},"categories":[1],"tags":[],"class_list":["post-16439","post","type-post","status-publish","format-standard","hentry","category-sql"],"_links":{"self":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/16439","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/comments?post=16439"}],"version-history":[{"count":2,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/16439\/revisions"}],"predecessor-version":[{"id":24656,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/16439\/revisions\/24656"}],"wp:attachment":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/media?parent=16439"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/categories?post=16439"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/tags?post=16439"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}