0

I get the data of all the movies on my home page. But I don't want to do this on the Admin.html page. On the admin page, when I click on the name of the movie, I want to go to the page related to that movie. For example, when I click on the movie "Schindler's List" which movieId is 3 (Admin.html?movieId=3), I want to go to a page with only Schindler's List movie information. It will show only Schindler List's img,score,name. How can I achieve this?

Admin.html

import { initializeApp } from "https://www.gstatic.com/firebasejs/9.4.0/firebase-app.js";
          import { getDatabase, set, ref, update, get, child } from "https://www.gstatic.com/firebasejs/9.4.0/firebase-database.js";
          import { getAuth, createUserWithEmailAndPassword, signInWithEmailAndPassword, onAuthStateChanged, signOut } from "https://www.gstatic.com/firebasejs/9.4.0/firebase-auth.js";
    
            const firebaseConfig = {
            apiKey: "",
            authDomain: "",
            databaseURL: "",
            projectId: "",
            storageBucket: "",
            messagingSenderId: "",
            appId: "",
            measurementId: ""
      };
    
           const app = initializeApp(firebaseConfig);
           const db = getDatabase(app);
           const auth = getAuth(app);
    
            btnCreate.addEventListener('click',(e)=>{
                   var movieId = document.getElementById('movieId').value;
                  var movieName = document.getElementById('movieName').value;
                 var movieScore = document.getElementById('movieScore').value;
                var movieImage = document.getElementById('movieImage').value;
                set(ref(db, 'Movies/' + movieId), {
                movieId: movieId,
                movieName: movieName,
                movieScore: movieScore,
                movieImage : movieImage
                });
      });
    
                let html = '';
                var body = document.getElementById('editor');
                var body2 = document.getElementById('week');
                function AddItemsToTable(name,score,img,id){
                let html='';
                const movies=`
                    <div class="content"><img src="${img}"><p><a href="Admin.html?movieId=${id}">${name}</a></p> <p> <img src="img/mutlu.png" class="emoji"><a class="scoretxt">${score}</a> </p> </div>
                `;
                html = movies;
                body.innerHTML += html;
                body2.innerHTML+=html;
    
            }
            function AddAllItemsToTable(TheMovies){
                body.innerHTML="";
                TheMovies.forEach(element => {
                    AddItemsToTable(element.movieName, element.movieScore, element.movieImage,element.movieId);
            });
            }
    
            function getAllDataOnce(){
                const dbRef=ref(db);
                get(child(dbRef,"Movies"))
                        .then((snapshot)=>{
                            var movies=[];
                    snapshot.forEach(childSnapshot => {
                        movies.push(childSnapshot.val())
                    });
                    AddAllItemsToTable(movies);
                });
            }
                window.onload= getAllDataOnce;

Admin.html

  • 1
    Implementing the entire use-case is a bit broad to answer here on Stack Overflow, but this would probably be a good place to get started: https://stackoverflow.com/questions/901115/how-can-i-get-query-string-values-in-javascript/3855394#3855394 – Frank van Puffelen Dec 23 '21 at 14:43
  • i got the id value but now dunno what to do – beytullahdanis Dec 23 '21 at 16:58

0 Answers0