Почему у меня ошибка Uncaught (in promise) TypeError: Cannot read property 'value' of null?

Question

[Иван Фурсов]

Почему у меня ошибка Uncaught (in promise) TypeError: Cannot read property 'value' of null как исправить?

let div = document.getElementById("div1");

eel.expose(Errorip);

async function ipAdress(index) {
    console.log(index)
    div.innerHTML = "<p>checking</p>"

    let ip = document.querySelector('#ip_server').value;

    console.log(ip);
    await eel.new_ip(index, ip)
}

function Errorip(index) {
    div.innerHTML = "<p>Error ip</p>";
    div.innerHTML += "<p><input id=\"ip_server\" type=\"text\" size=\"12\">Need new ip or checking server</p>";
    if (index == "1") {
        div.innerHTML += "<button onclick=\"ipAdress('1')\">start</button>";
    } else if (index == "2") {
        div.innerHTML += "<button onclick=\"ipAdress('2')\">start</button>";
    }
}

async function Click(command) {
    let namefile = document.querySelector('#name_file').value;

    if (checkbox.checked) {
        let res = await eel.client_metion(command, "True", namefile)();
        div.innerHTML = "<p>" + res + "</p>"
    } else {
        let res = await eel.client_metion(command, "False", namefile)();
        div.innerHTML = "<p>" + res + "</p>"
    }
}

где eel.(т.д) то я использую python, но проблема в этой строчке кода let ip = document.querySelector('#ip_server').value;

Answer 1

[Иван Фурсов]

Я сначала загружал новый контент но хотел получить значение из старого и из-за этого ошибка нужно было зделать так

async function ipAdress(index) {
    console.log(index)

    let ip = document.querySelector('#ip_server').value;

    div.innerHTML = "<p>checking</p>"

    console.log(ip);
    await eel.new_ip(index, ip)
}

Answer 2

[Rsa97]

На момент вызова querySelector на странице нет элемента с идентификатором ip_server.

Comments

[Иван Фурсов]

как исправить?

[Иван Фурсов]

я загружаю в div контент и потом по нажатию на кнопку вызываю функцию ipAdress

загружаемый контент

function Errorip(index) {
    div.innerHTML = "<p>Error ip</p>";
    div.innerHTML += "<p><input id=\"ip_server\" type=\"text\" size=\"12\">Need new ip or checking server</p>";
    if (index == "1") {
        div.innerHTML += "<button onclick=\"ipAdress('1')\">start</button>";
    } else if (index == "2") {
        div.innerHTML += "<button onclick=\"ipAdress('2')\">start</button>";
    }
}

после вызываю функцию по нажатию кнопки

async function ipAdress(index) {
    console.log(index)
    div.innerHTML = "<p>checking</p>"

    let ip = document.querySelector('#ip_server').value;

    console.log(ip);
    await eel.new_ip(index, ip)
}

[AnvarjonS4957Y]

Дед Герасим, Если у вас #ip_server уже существовал в html то вам просто нужно опустить js код под конец body,если это не так то вызвать функцию для создания #ip_server , а потом достать значение с помощью querySelector

[Иван Фурсов]

AnvarjonS4957Y, вот функция которая создаёт #ip_server

function Errorip(index) {
    div.innerHTML = "<p>Error ip</p>";
    div.innerHTML += "<p><input id=\"ip_server\" type=\"text\" size=\"12\">Need new ip or checking server</p>";
    if (index == "1") {
        div.innerHTML += "<button onclick=\"ipAdress('1')\">start</button>";
    } else if (index == "2") {
        div.innerHTML += "<button onclick=\"ipAdress('2')\">start</button>";
    }
}

[AnvarjonS4957Y]

Дед Герасим, Помоему вы не написали ничего в input и оно вызывает ошибку.
Null это то значение которое не определено.
Вам нужно добавить:
if (ip == null){
/*Функция которая переспросить #ip_server.value*/
}