0

First of all, let me tell you my purpose. If the entry is blank, a divin will appear, but when something is typed the divin will be "display: none". I want this to happen, but as shown in the video, I tell me not to press the delete key if the input value is blank and it works, 3 words and "I deleted the number 8" only appeared 3 times on the screen recording. Strangely, when the delete key is pressed slowly, the divim successfully "display: block", but when I hold my finger without pulling it (I tried it in the key press event) it doesn't do that. You can check all the codes on my github account. Full code: https://github.com/BerkayAkgurgen/Film-ProjectAPI/tree/main
Screen Record

// key event
searchInput.addEventListener('keydown', e => {
        let control = false
        if (e.which == 8 && searchInput.value.trim() == "") {
            control = true
        } else {
            control = false
        }
        if (control) {
            e.preventDefault()
            return
        }
        console.log(e.which);
    })


where I check empty input 
if (inputValue == "" || !isNaN(inputValue)) {
        ui.clearInput()
        ui.returnBack()
    } else {
        filmRequest.getDatas(inputValue)
            .then(data => {
                ui.displayResults(data)
                ui.resultUI()
            })
    }


// Style Changes
returnBack() {
        this.mostPopulerHeader.style.display = "block"
        this.topParents.style.display = "grid"
        this.resultHeader.style.display = "none"
        this.resultParent.style.display = "none"
    }

    resultUI() {
        this.mostPopulerHeader.style.display = "none"
        this.topParents.style.display = "none"
        this.resultHeader.style.display = "block"
        this.resultParent.style.display = "grid"
    }
  • So you're wondering why the results are blank afterr they showed up properly at first? – Anders Kitson Mar 09 '21 at 21:22
  • wait you want it to show blank only when there are 8 characters or less not 3? – Anders Kitson Mar 09 '21 at 21:29
  • I don't quite understand the problem, if you could explain clearer. It seems to work for me. – Anders Kitson Mar 09 '21 at 21:31
  • @AndersKitson When the entry is blank, I get a "not found" warning. When the entry is blank, movies that say "Top 10 Movies" should appear. –  Mar 09 '21 at 21:41
  • As I said, press and hold the delete key to delete it. Weird, don't delete the characters slowly, but try to delete it by holding it down as it appears in the video. –  Mar 09 '21 at 21:43
  • ok I see the issue now, let me take a look – Anders Kitson Mar 09 '21 at 21:49
  • hmm... so that api key ran out, but I tried to create a new one and it said it was activated, but it doesn't work. Have to debug futher. Not sure how to resolve at this point – Anders Kitson Mar 09 '21 at 22:13
  • API key is working. I am still using it right now and I do not see any other errors. If you see what you see, I would appreciate it if you let me know. –  Mar 09 '21 at 22:15
  • Not sure if it would work but try `if (inputValue.trim() == "" || !isNaN(inputValue)) {` instead – Anders Kitson Mar 09 '21 at 22:23
  • or you could try `if (!inputValue|| !isNaN(inputValue)) {` – Anders Kitson Mar 09 '21 at 22:24
  • Doesn't work but thanks for trying. –  Mar 09 '21 at 22:27
  • Try reading this see if it makes sense, it should be checking when that value is empty and rendering your top 10 UI https://stackoverflow.com/questions/154059/how-can-i-check-for-an-empty-undefined-null-string-in-javascript – Anders Kitson Mar 09 '21 at 22:30

0 Answers0