Skip to content
geeksforgeeks
  • Courses
    • DSA to Development
    • Get IBM Certification
    • Newly Launched!
      • Master Django Framework
      • Become AWS Certified
    • For Working Professionals
      • Interview 101: DSA & System Design
      • Data Science Training Program
      • JAVA Backend Development (Live)
      • DevOps Engineering (LIVE)
      • Data Structures & Algorithms in Python
    • For Students
      • Placement Preparation Course
      • Data Science (Live)
      • Data Structure & Algorithm-Self Paced (C++/JAVA)
      • Master Competitive Programming (Live)
      • Full Stack Development with React & Node JS (Live)
    • Full Stack Development
    • Data Science Program
    • All Courses
  • Tutorials
    • Data Structures & Algorithms
    • ML & Data Science
    • Interview Corner
    • Programming Languages
    • Web Development
    • CS Subjects
    • DevOps And Linux
    • School Learning
  • Practice
    • GfG 160: Daily DSA
    • Problem of the Day
    • Practice Coding Problems
    • GfG SDE Sheet
  • HTML Tutorial
  • HTML Exercises
  • HTML Tags
  • HTML Attributes
  • Global Attributes
  • Event Attributes
  • HTML Interview Questions
  • HTML DOM
  • DOM Audio/Video
  • HTML 5
  • HTML Examples
  • Color Picker
  • A to Z Guide
  • HTML Formatter
Open In App
Next Article:
Mailer multiple address in PHP
Next article icon

Upload pdf file to MySQL database for multiple records using PHP

Last Updated : 01 Jun, 2022
Comments
Improve
Suggest changes
Like Article
Like
Report

We will upload multiple records to the database and display all the records from the database on the same page. 

In this article, we will see how we can upload PDF files to a MySQL database using PHP. 

Approach: Make sure you have XAMPP or WAMP installed on your machine. In this tutorial, we will be using the WAMP server.

Creating Database and Table:

First, we will create a database named 'geeksforgeeks'. You can use your existing database or create a new one. Create a table named 'pdf_data' with 3 columns to store the data. Refer to the following screenshot for table structure.

table structure

Copy and paste the following code into the SQL panel of your PHPMyAdmin.

CREATE TABLE IF NOT EXISTS `pdf_data` (
  `id` int(50) NOT NULL AUTO_INCREMENT,
  `username` varchar(50) NOT NULL,
  `filename` varchar(255) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

We will be using Bootstrap to use Bootstrap's Responsive Grid System. Below is the code to include the Bootstrap CDN link in the head section of the HTML code.

  • dbcon.php: This code demonstrates to connect our application to the database.
PHP

    $host = 'localhost';
    $user = 'root';
    $password = '';
    $database = 'geeksforgeeks';

    $con = mysqli_connect($host, $user, $password, $database);

    if (!$con){
        ?>
            
        
    }
?>

Creating folder and files:

We will now create a folder named "pdf". The files uploaded by the client on the server will be stored in this folder. Create index.php and style.css. Keep your main project folder (For example.. GeeksForGeeks) in the "C://wamp64/www/", if you are using WAMP or "C://xampp/htdocs/" folder if you are using the XAMPP server respectively. The folder structure should look like below:

folder structure

Creating form: With the HTML form, we are collecting the data from the user by enabling the .pdf file attachment to upload.

HTML Form

HTML code snippet: Below is the HTML source code for the HTML form. In the HTML

tag, we are using "enctype='multipart/form-data" which is an encoding type that allows files to be sent through a POST method. Without this encoding, the files cannot be sent through the POST method. We must use this enctype if you want to allow users to upload a file through a form.

HTML
<form method="post" enctype="multipart/form-data">
    <div class="form-input py-2">
        <div class="form-group">
          <input type="text" class="form-control" name="name" 
                 placeholder="Enter your name" required>
        div>                                  
        <div class="form-group">
          <input type="file" name="pdf_file" 
                 class="form-control" accept=".pdf" 
                 title="Upload PDF"/>
        div>
        <div class="form-group">
          <input type="submit" class="btnRegister" 
                 name="submit" value="Submit">
        div>
   div>
form>

Upload PDF files: Now we will see how we can upload PDF files to the database. In the below code, the first block verifies that the ‘submit’ button from the form has been clicked and it verifies that the ‘pdf_file’ field has an attachment using the PHP isset() function.

$_FILES is a two-dimensional associative global array of items that are being uploaded via the HTTP POST method. The move_uploaded_file() function is used to upload the pdf file to the server. We are passing 2 values, the temporary file name and the folder where the file will be stored. The files will be stored in the "GeeksForGeeks/pdf/ " folder which we created earlier.

PHP

    if (isset($_POST['submit'])) {

        $name = $_POST['name'];

        if (isset($_FILES['pdf_file']['name']))
        {
          $file_name = $_FILES['pdf_file']['name'];
          $file_tmp = $_FILES['pdf_file']['tmp_name'];

          move_uploaded_file($file_tmp,"./pdf/".$file_name);

          $insertquery = 
          "INSERT INTO pdf_data(username,filename) VALUES('$name','$file_name')";
          $iquery = mysqli_query($con, $insertquery);
        }
        else
        {
           ?>
            
"alert alert-danger alert-dismissible fade show text-center"> aria-label="close">× Failed! File must be uploaded in PDF format!
} } ?>

Creating HTML Table and displaying records:

We will fetch the records from the database and display them in the HTML table.

displaying records from the database

HTML code snippet: The HTML source code for the above HTML table is as follows.

HTML
<div class="card-body">
    <div class="table-responsive">
        <table>
            <thead>
                <th>IDth>
                <th>UserNameth>
                <th>FileNameth>
            thead>
            <tbody>
                
                    $selectQuery = "select * from pdf_data";
                    $squery = mysqli_query($con, $selectQuery);
                    
                    while (($result = mysqli_fetch_assoc($squery))) {
                ?>
                <tr>
                  <td>td>
                  <td>td>
                  <td>td>
                tr>
                
                    }
                ?>
            tbody>
        table>                
    div>
div>

PHP code:

Approach:

First, we are selecting all the columns from the table pdf_data and then execute the query in $squery.

$selectQuery = "select * from pdf_data"; 
$squery = mysqli_query($con, $selectQuery);

Next, we will use the while loop to fetch all the rows of the table and store the data in $result.

while (($result = mysqli_fetch_assoc($squery)))
{
    ...
}

The fetched data will now be displayed column-wise in the HTML table with the help of where 'id' is the first column of our 'pdf_data' table. Similarly, we can fetch the data for the respective columns from the table.

  
  
  

Full code: The final code for uploading the PDF file into the MySQL database and displaying all the records from the table using PHP is as follows. This full code includes:

  • index.php
  • style.css
  • dbcon.php
PHP
 include 'dbcon.php'; ?>



  
    
"https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
    


    
Fill UserName and Upload PDF // If submit button is clicked if (isset($_POST['submit'])) { // get name from the form when submitted $name = $_POST['name']; if (isset($_FILES['pdf_file']['name'])) { // If the ‘pdf_file’ field has an attachment $file_name = $_FILES['pdf_file']['name']; $file_tmp = $_FILES['pdf_file']['tmp_name']; // Move the uploaded pdf file into the pdf folder move_uploaded_file($file_tmp,"./pdf/".$file_name); // Insert the submitted data from the form into the table $insertquery = "INSERT INTO pdf_data(username,filename) VALUES('$name','$file_name')"; // Execute insert query $iquery = mysqli_query($con, $insertquery); if ($iquery) { ?>
"alert alert-success alert-dismissible fade show text-center"> × Success! Data submitted successfully.
} else { ?>
"alert alert-danger alert-dismissible fade show text-center"> × Failed! Try Again!
} } else { ?>
"alert alert-danger alert-dismissible fade show text-center"> × Failed! File must be uploaded in PDF format!
}// end if }// end if ?>
placeholder="Enter your name" name="name">
class="form-control" accept=".pdf" required/>
class="btnRegister" name="submit" value="Submit">

Records from Database

$selectQuery = "select * from pdf_data"; $squery = mysqli_query($con, $selectQuery); while (($result = mysqli_fetch_assoc($squery))) { ?> } ?>
ID UserName FileName
echo $result['id']; ?> echo $result['username']; ?> echo $result['filename']; ?>
CSS
/* style.css */

*{
    margin: 0; padding: 0; box-sizing: border-box;
}
body{
    justify-content: center;
    align-items: center;
}

/* Form */

.form-input{
    max-width: 400px;
}

/* Styling HTML Table */

table{
    border-collapse: collapse;
    background-color: #fff;
    border-radius: 10px;
    margin: auto;
}
th,td{
    border: 1px solid #dfdede;
    padding: 8px 25px;
    justify-content: center;
    text-align: center;
    align-items: center;
    color: grey;
}
th{
    text-transform: uppercase;
    font-weight: 900;
}
td{ font-size: 1.2rem; }
PHP
// dbcon.php


    $host = 'localhost';
    $user = 'root';
    $password = '';
    $database = 'gfg';

    $con = mysqli_connect($host, $user, $password, $database);

    if (!$con){
        ?>
            
        
    }
?>

Output: Finally, you should be able to upload the pdf files and display the records from the database on the same page.

uploading pdf and displaying

In the next article, we will see how we can display PDF files from the MySQL database using PHP. The PDF file will only display when clicking on a particular record.


Next Article
Mailer multiple address in PHP

S

sanjyotpanure
Improve
Article Tags :
  • HTML
  • Web technologies
  • mysql
  • PHP-MySQL

Similar Reads

    How to create admin login page using PHP?
    In this article, we will see how we can create a login page for admin, connected with the database, or whose information to log in to the page is already stored in our database.  Follow the steps to create an admin login page using PHP:  Approach: Make sure you have XAMPP or WAMP installed on your w
    4 min read
    Signup form using PHP and MySQL Database
    The task is to create and design a sign-up form in which if the user enters details, the HTML form data are inserted into our MySQL server database. Approach: First task is that we have to create our MySQL server Database and a Table according to our requirements. We connect our MySQL server Databas
    4 min read
    Online Group Chat application using PHP
    Prerequisites: Technical knowledge: HTMLCSSJavascript (basics)PHP (Database connectivity)SQL queries Softwares to be installed: XAMPP server: This is a free software which contains web server Apache, Database management system for MySQL (or MariaDB). It can be downloaded for free from the official s
    9 min read
    How to Resize JPEG Image in PHP ?
    Why do we need to resize images? In a website, often, we need to scale an image to fit a particular section. Sometimes, it becomes necessary to scale down any image of random size to fit a cover photo section or profile picture section. Also, we need to show a thumbnail of a bigger image. In those c
    2 min read
    How to make PDF file downloadable in HTML link using PHP ?
    In web development, it is common to provide users with downloadable resources, such as PDF files. If you want to create a downloadable PDF link using HTML and PHP, this article will guide you through the process of making a PDF file downloadable when the user clicks on a link. ApproachCreate an HTML
    3 min read
    How to extract img src and alt from html using PHP?
    Extraction of image attributes like 'src', 'alt', 'height', 'width' etc from a HTML page using PHP. This task can be done using the following steps. Loading HTML content in a variable(DOM variable). Selecting each image in that document. Selecting attribute and save it's content to a variable. Outpu
    2 min read
    Upload pdf file to MySQL database for multiple records using PHP
    We will upload multiple records to the database and display all the records from the database on the same page.  In this article, we will see how we can upload PDF files to a MySQL database using PHP.  Approach: Make sure you have XAMPP or WAMP installed on your machine. In this tutorial, we will be
    7 min read
    Mailer multiple address in PHP
    In this article, we will be demonstrating how we can send the mail to the multiple addresses from the database using the PHP. PHPMailer library is used to send any email safely from the unknown e-mail to any mail id using PHP code through XAMPP web-server for this project. Installation process for a
    2 min read
    Covid 19 Tracker Web App using PHP
    In this article, we will see how to create a web application for tracking the Covid19 using PHP. Our Covid19 Tracker app will give the latest information for the States and Union Territories of India about the following things.Number of Active Cases of Covid19.Number of Confirmed Cases of Covid19.Nu
    3 min read
    How to automatically start a download in PHP ?
    This post deals with creating a start downloading file using PHP. The idea is to make a download button which will redirect you to another page with the PHP script that will automatically start the download. Creating a download button: html
    2 min read
geeksforgeeks-footer-logo
Corporate & Communications Address:
A-143, 7th Floor, Sovereign Corporate Tower, Sector- 136, Noida, Uttar Pradesh (201305)
Registered Address:
K 061, Tower K, Gulshan Vivante Apartment, Sector 137, Noida, Gautam Buddh Nagar, Uttar Pradesh, 201305
GFG App on Play Store GFG App on App Store
Advertise with us
  • Company
  • About Us
  • Legal
  • Privacy Policy
  • In Media
  • Contact Us
  • Advertise with us
  • GFG Corporate Solution
  • Placement Training Program
  • Languages
  • Python
  • Java
  • C++
  • PHP
  • GoLang
  • SQL
  • R Language
  • Android Tutorial
  • Tutorials Archive
  • DSA
  • Data Structures
  • Algorithms
  • DSA for Beginners
  • Basic DSA Problems
  • DSA Roadmap
  • Top 100 DSA Interview Problems
  • DSA Roadmap by Sandeep Jain
  • All Cheat Sheets
  • Data Science & ML
  • Data Science With Python
  • Data Science For Beginner
  • Machine Learning
  • ML Maths
  • Data Visualisation
  • Pandas
  • NumPy
  • NLP
  • Deep Learning
  • Web Technologies
  • HTML
  • CSS
  • JavaScript
  • TypeScript
  • ReactJS
  • NextJS
  • Bootstrap
  • Web Design
  • Python Tutorial
  • Python Programming Examples
  • Python Projects
  • Python Tkinter
  • Python Web Scraping
  • OpenCV Tutorial
  • Python Interview Question
  • Django
  • Computer Science
  • Operating Systems
  • Computer Network
  • Database Management System
  • Software Engineering
  • Digital Logic Design
  • Engineering Maths
  • Software Development
  • Software Testing
  • DevOps
  • Git
  • Linux
  • AWS
  • Docker
  • Kubernetes
  • Azure
  • GCP
  • DevOps Roadmap
  • System Design
  • High Level Design
  • Low Level Design
  • UML Diagrams
  • Interview Guide
  • Design Patterns
  • OOAD
  • System Design Bootcamp
  • Interview Questions
  • Inteview Preparation
  • Competitive Programming
  • Top DS or Algo for CP
  • Company-Wise Recruitment Process
  • Company-Wise Preparation
  • Aptitude Preparation
  • Puzzles
  • School Subjects
  • Mathematics
  • Physics
  • Chemistry
  • Biology
  • Social Science
  • English Grammar
  • Commerce
  • World GK
  • GeeksforGeeks Videos
  • DSA
  • Python
  • Java
  • C++
  • Web Development
  • Data Science
  • CS Subjects
@GeeksforGeeks, Sanchhaya Education Private Limited, All rights reserved
We use cookies to ensure you have the best browsing experience on our website. By using our site, you acknowledge that you have read and understood our Cookie Policy & Privacy Policy
Lightbox
Improvement
Suggest Changes
Help us improve. Share your suggestions to enhance the article. Contribute your expertise and make a difference in the GeeksforGeeks portal.
geeksforgeeks-suggest-icon
Create Improvement
Enhance the article with your expertise. Contribute to the GeeksforGeeks community and help create better learning resources for all.
geeksforgeeks-improvement-icon
Suggest Changes
min 4 words, max Words Limit:1000

Thank You!

Your suggestions are valuable to us.

'); // $('.spinner-loading-overlay').show(); let script = document.createElement('script'); script.src = 'https://assets.geeksforgeeks.org/v2/editor-prod/static/js/bundle.min.js'; script.defer = true document.head.appendChild(script); script.onload = function() { suggestionModalEditor() //to add editor in suggestion modal if(loginData && loginData.premiumConsent){ personalNoteEditor() //to load editor in personal note } } script.onerror = function() { if($('.editorError').length){ $('.editorError').remove(); } var messageDiv = $('
').text('Editor not loaded due to some issues'); $('#suggestion-section-textarea').append(messageDiv); $('.suggest-bottom-btn').hide(); $('.suggestion-section').hide(); editorLoaded = false; } }); //suggestion modal editor function suggestionModalEditor(){ // editor params const params = { data: undefined, plugins: ["BOLD", "ITALIC", "UNDERLINE", "PREBLOCK"], } // loading editor try { suggestEditorInstance = new GFGEditorWrapper("suggestion-section-textarea", params, { appNode: true }) suggestEditorInstance._createEditor("") $('.spinner-loading-overlay:eq(0)').remove(); editorLoaded = true; } catch (error) { $('.spinner-loading-overlay:eq(0)').remove(); editorLoaded = false; } } //personal note editor function personalNoteEditor(){ // editor params const params = { data: undefined, plugins: ["UNDO", "REDO", "BOLD", "ITALIC", "NUMBERED_LIST", "BULLET_LIST", "TEXTALIGNMENTDROPDOWN"], placeholderText: "Description to be......", } // loading editor try { let notesEditorInstance = new GFGEditorWrapper("pn-editor", params, { appNode: true }) notesEditorInstance._createEditor(loginData&&loginData.user_personal_note?loginData.user_personal_note:"") $('.spinner-loading-overlay:eq(0)').remove(); editorLoaded = true; } catch (error) { $('.spinner-loading-overlay:eq(0)').remove(); editorLoaded = false; } } var lockedCasesHtml = `You can suggest the changes for now and it will be under 'My Suggestions' Tab on Write.

You will be notified via email once the article is available for improvement. Thank you for your valuable feedback!`; var badgesRequiredHtml = `It seems that you do not meet the eligibility criteria to create improvements for this article, as only users who have earned specific badges are permitted to do so.

However, you can still create improvements through the Pick for Improvement section.`; jQuery('.improve-header-sec-child').on('click', function(){ jQuery('.improve-modal--overlay').hide(); $('.improve-modal--suggestion').hide(); jQuery('#suggestion-modal-alert').hide(); }); $('.suggest-change_wrapper, .locked-status--impove-modal .improve-bottom-btn').on('click',function(){ // when suggest changes option is clicked $('.ContentEditable__root').text(""); $('.suggest-bottom-btn').html("Suggest changes"); $('.thank-you-message').css("display","none"); $('.improve-modal--improvement').hide(); $('.improve-modal--suggestion').show(); $('#suggestion-section-textarea').show(); jQuery('#suggestion-modal-alert').hide(); if(suggestEditorInstance !== null){ suggestEditorInstance.setEditorValue(""); } $('.suggestion-section').css('display', 'block'); jQuery('.suggest-bottom-btn').css("display","block"); }); $('.create-improvement_wrapper').on('click',function(){ // when create improvement option clicked then improvement reason will be shown if(loginData && loginData.isLoggedIn) { $('body').append('
'); $('.spinner-loading-overlay').show(); jQuery.ajax({ url: writeApiUrl + 'create-improvement-post/?v=1', type: "POST", contentType: 'application/json; charset=utf-8', dataType: 'json', xhrFields: { withCredentials: true }, data: JSON.stringify({ gfg_id: post_id }), success:function(result) { $('.spinner-loading-overlay:eq(0)').remove(); $('.improve-modal--overlay').hide(); $('.unlocked-status--improve-modal-content').css("display","none"); $('.create-improvement-redirection-to-write').attr('href',writeUrl + 'improve-post/' + `${result.id}` + '/', '_blank'); $('.create-improvement-redirection-to-write')[0].click(); }, error:function(e) { showErrorMessage(e.responseJSON,e.status) }, }); } else { if(loginData && !loginData.isLoggedIn) { $('.improve-modal--overlay').hide(); if ($('.header-main__wrapper').find('.header-main__signup.login-modal-btn').length) { $('.header-main__wrapper').find('.header-main__signup.login-modal-btn').click(); } return; } } }); $('.left-arrow-icon_wrapper').on('click',function(){ if($('.improve-modal--suggestion').is(":visible")) $('.improve-modal--suggestion').hide(); else{ } $('.improve-modal--improvement').show(); }); const showErrorMessage = (result,statusCode) => { if(!result) return; $('.spinner-loading-overlay:eq(0)').remove(); if(statusCode == 403) { $('.improve-modal--improve-content.error-message').html(result.message); jQuery('.improve-modal--overlay').show(); jQuery('.improve-modal--improvement').show(); $('.locked-status--impove-modal').css("display","block"); $('.unlocked-status--improve-modal-content').css("display","none"); $('.improve-modal--improvement').attr("status","locked"); return; } } function suggestionCall() { var editorValue = suggestEditorInstance.getValue(); var suggest_val = $(".ContentEditable__root").find("[data-lexical-text='true']").map(function() { return $(this).text().trim(); }).get().join(' '); suggest_val = suggest_val.replace(/\s+/g, ' ').trim(); var array_String= suggest_val.split(" ") //array of words var gCaptchaToken = $("#g-recaptcha-response-suggestion-form").val(); var error_msg = false; if(suggest_val != "" && array_String.length >=4){ if(editorValue.length <= 2000){ var payload = { "gfg_post_id" : `${post_id}`, "suggestion" : `${editorValue}`, } if(!loginData || !loginData.isLoggedIn) // User is not logged in payload["g-recaptcha-token"] = gCaptchaToken jQuery.ajax({ type:'post', url: "https://apiwrite.geeksforgeeks.org/suggestions/auth/create/", xhrFields: { withCredentials: true }, crossDomain: true, contentType:'application/json', data: JSON.stringify(payload), success:function(data) { if(!loginData || !loginData.isLoggedIn) { grecaptcha.reset(); } jQuery('.spinner-loading-overlay:eq(0)').remove(); jQuery('.suggest-bottom-btn').css("display","none"); $('#suggestion-section-textarea').hide() $('.thank-you-message').css('display', 'flex'); $('.suggestion-section').css('display', 'none'); jQuery('#suggestion-modal-alert').hide(); }, error:function(data) { if(!loginData || !loginData.isLoggedIn) { grecaptcha.reset(); } jQuery('.spinner-loading-overlay:eq(0)').remove(); jQuery('#suggestion-modal-alert').html("Something went wrong."); jQuery('#suggestion-modal-alert').show(); error_msg = true; } }); } else{ jQuery('.spinner-loading-overlay:eq(0)').remove(); jQuery('#suggestion-modal-alert').html("Minimum 4 Words and Maximum Words limit is 1000."); jQuery('#suggestion-modal-alert').show(); jQuery('.ContentEditable__root').focus(); error_msg = true; } } else{ jQuery('.spinner-loading-overlay:eq(0)').remove(); jQuery('#suggestion-modal-alert').html("Enter atleast four words !"); jQuery('#suggestion-modal-alert').show(); jQuery('.ContentEditable__root').focus(); error_msg = true; } if(error_msg){ setTimeout(() => { jQuery('.ContentEditable__root').focus(); jQuery('#suggestion-modal-alert').hide(); }, 3000); } } document.querySelector('.suggest-bottom-btn').addEventListener('click', function(){ jQuery('body').append('
'); jQuery('.spinner-loading-overlay').show(); if(loginData && loginData.isLoggedIn) { suggestionCall(); return; } // script for grecaptcha loaded in loginmodal.html and call function to set the token setGoogleRecaptcha(); }); $('.improvement-bottom-btn.create-improvement-btn').click(function() { //create improvement button is clicked $('body').append('
'); $('.spinner-loading-overlay').show(); // send this option via create-improvement-post api jQuery.ajax({ url: writeApiUrl + 'create-improvement-post/?v=1', type: "POST", contentType: 'application/json; charset=utf-8', dataType: 'json', xhrFields: { withCredentials: true }, data: JSON.stringify({ gfg_id: post_id }), success:function(result) { $('.spinner-loading-overlay:eq(0)').remove(); $('.improve-modal--overlay').hide(); $('.create-improvement-redirection-to-write').attr('href',writeUrl + 'improve-post/' + `${result.id}` + '/', '_blank'); $('.create-improvement-redirection-to-write')[0].click(); }, error:function(e) { showErrorMessage(e.responseJSON,e.status); }, }); });
"For an ad-free experience and exclusive features, subscribe to our Premium Plan!"
Continue without supporting
`; $('body').append(adBlockerModal); $('body').addClass('body-for-ad-blocker'); const modal = document.getElementById("adBlockerModal"); modal.style.display = "block"; } function handleAdBlockerClick(type){ if(type == 'disabled'){ window.location.reload(); } else if(type == 'info'){ document.getElementById("ad-blocker-div").style.display = "none"; document.getElementById("ad-blocker-info-div").style.display = "flex"; handleAdBlockerIconClick(0); } } var lastSelected= null; //Mapping of name and video URL with the index. const adBlockerVideoMap = [ ['Ad Block Plus','https://media.geeksforgeeks.org/auth-dashboard-uploads/abp-blocker-min.mp4'], ['Ad Block','https://media.geeksforgeeks.org/auth-dashboard-uploads/Ad-block-min.mp4'], ['uBlock Origin','https://media.geeksforgeeks.org/auth-dashboard-uploads/ub-blocke-min.mp4'], ['uBlock','https://media.geeksforgeeks.org/auth-dashboard-uploads/U-blocker-min.mp4'], ] function handleAdBlockerIconClick(currSelected){ const videocontainer = document.getElementById('ad-blocker-info-div-gif'); const videosource = document.getElementById('ad-blocker-info-div-gif-src'); if(lastSelected != null){ document.getElementById("ad-blocker-info-div-icons-"+lastSelected).style.backgroundColor = "white"; document.getElementById("ad-blocker-info-div-icons-"+lastSelected).style.borderColor = "#D6D6D6"; } document.getElementById("ad-blocker-info-div-icons-"+currSelected).style.backgroundColor = "#D9D9D9"; document.getElementById("ad-blocker-info-div-icons-"+currSelected).style.borderColor = "#848484"; document.getElementById('ad-blocker-info-div-name-span').innerHTML = adBlockerVideoMap[currSelected][0] videocontainer.pause(); videosource.setAttribute('src', adBlockerVideoMap[currSelected][1]); videocontainer.load(); videocontainer.play(); lastSelected = currSelected; }

What kind of Experience do you want to share?

Interview Experiences
Admission Experiences
Career Journeys
Work Experiences
Campus Experiences
Competitive Exam Experiences