[ANSWERED] javascript – Input fields dead after clearing them

Question 1

I reproduced your code after removing the script which is not explained why you are using it, anyhow below is a code using jQuery does the trick, this should get you to the right place at least.. if still didn’t work with you post a better explanation of your code for a better help…
mark it as answered if it solves your problem….

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <title>Document</title>
</head>
<body>
        <input type="text" id="testinput" />
        <button id="clear">Clear</button>
<script>
$(document).ready(()=>{
    document.getElementById('clear').addEventListener("click", clear);
})
function clear() {
    if (confirm("Clear all inputs?")) {
        document.querySelectorAll('input').forEach((input) => {
            $(input).val('');
        })
    }
}
</script>
</body>
</html>

Question 2

The problem was not clearing the inputs, but rather showing the confirm box. I used the following snippet instead:

dialog.showMessageBoxSync(
    title: "Clear inputs",
    message: "Clear all input boxes?",
    type: "warning",
    buttons: ["Cancel", "Ok"]
})

And now everything works as expected.

Question 3

In my electron app I have a function to clear my input fields on a button press, but after using it I can’t click and type into inputs anymore. However, if I open up the inspector window, they work again.

Why does this happen and how do I fix it?

Electron app’s main.js:

const { app, BrowserWindow, Menu } = require('electron');
let win;

function createWindow() {
    win = new BrowserWindow();
    win.loadFile('window_main/index.html');
}

app.on('ready', createWindow);

index.html

<body>
    <input type="text" id="testinput" />
    <button id="clear">Clear</button>
    <script src="index.js" type="text/javascript"></script>
</body>

The problematic bit of JS in index.js:

document.getElementById('clear').addEventListener("click", clear);

function clear() {
    if (confirm("Clear all inputs?")) {
        document.querySelectorAll('input').forEach((input) => {
            input.value = '';
        })
    }
}

Bollate

[ANSWERED] javascript – Input fields dead after clearing them

By

Solution 1 :

Solution 2 :

Problem :

Comments

Comment posted by CheeseCrustery

Comment posted by Kai

Comment posted by CheeseCrustery

Comment posted by CheeseCrustery

Comment posted by Kai

By

Related Post

[ANSWERED] How do you add a background image in the margins and top of the page behind the body? (Html, Css)

[ANSWERED] html – I can’t get my carousel buttons to respond bootstrap 4

[ANSWERED] javascript – Locomotive Scroll not working with Vue.js when having to load images on page

You missed

[ANSWERED] javascript – Text box to display updated text and save on button click

[ANSWERED] javascript – Pass html tag to angularjs variable from controller

[ANSWERED] html – bootstrap mobile menu not scrolling instead the background is scrolling

[ANSWERED] html – How to play live stream YouTube videos using CEF4Delphi?

Bollate