Вызов нескольких функций на одной странице с помощью JavaScript

0

Я пытаюсь вызвать две функции с одинаковой функцией представления формы. Но вместо этого я получаю очень длинную ошибку.

<form name="form1" method="post" onClick="myFunction();">
    <input type="text" name="DomainName" id="Domain_name" required=""/>
    <input type="submit" value="Submit" />
    <div id="list_container"></div>
    <div id="table_container"></div>
</form>

JavaScript, который я использую, это:

function myFunction() {
    var input_domain = document.forms["form1"]["DomainName"].value;
    if (input_domain == null || input_domain == "") return;
    var container = document.getElementById("list_container");
    var ul = document.createElement("ul");
    var navLinks = ["crawler3", "crawler4", "crawler5"];
    for (var i = 0; i < navLinks.length; i++) {
        ul.innerHTML += "<li> " + navLinks[i] + "</li>";
    }
    document.getElementById("list_container").appendChild(ul);
    return false;
}

function createTable() {
    var input_domain = document.forms["form1"]["DomainName"].value;
    if (input_domain == null || input_domain == "") return;
    var table = document.createElement("table");
    var names = ["website1", "website2"];
    var container = document.getElementById("table_container");
    var tablebody = document.createElement("tbody");
    for (var i = 0, len = names.length; i < len; ++i) {
        var row = document.createElement("tr"),
            column1 = document.createElement("td"),
            column2 = document.createElement("td"),
            column3 = document.createElement("td"),
            column4 = document.createElement("td"),
            checkbox = document.createElement('input');
        checkbox.type = "checkbox";
        checkbox.name = names[i];
        checkbox.value = names[i];
        checkbox.id = names[i];
        var label = document.createElement('label')
        label.htmlFor = names[i];
        label.appendChild(document.createTextNode(names[i]));
        column1.appendChild(checkbox);
        column1.appendChild(label);

        var dropdown = document.createElement("select");
        dropdown.name = names[i] + "_select";
        var op1 = new Option();
        op1.value = "enable";
        op1.text = "enable";
        var op2 = new Option();
        op2.value = "disable";
        op2.text = "disable";
        dropdown.options.add(op1);
        dropdown.options.add(op2);
        column2.appendChild(dropdown);

        var datetime_from = document.createElement('input');
        datetime_from.type = "datetime-local";
        datetime_from.name = names[i] + "_from";
        column3.appendChild(datetime_from);


        var datetime_to = document.createElement('input');
        datetime_to.type = "datetime-local";
        datetime_to.name = names[i] + "_to";
        column4.appendChild(datetime_to);


        row.appendChild(column1);
        row.appendChild(column2);
        row.appendChild(column3);
        row.appendChild(column4);
        tablebody.appendChild(row);
    }
    table.appendChild(tablebody);
    document.getElementById("table_container").appendChild(table);
}

Ошибка, которую я получаю, такова:

{"error": "Форма оболочки не проверяет {'html_initial_name': u'initial-js_lib ',' form ':,' html_name ':' js_lib ',' html_initial_id ': u'initial-id_js_lib', 'label': u'Js lib ',' field ':,' help_text ':' ',' name ':' js_lib '} {' html_initial_name ': u'initial-js_wrap', 'form':, 'html_name': 'js_wrap ',' html_initial_id ': u'initial-id_js_wrap', 'label': u'Js wrap ',' field ':,' help_text ':' ',' name ':' js_wrap '} "}

Я попытался вернуть false в конце функции, чтобы предотвратить перезагрузку страницы, но она по-прежнему не работает. Пожалуйста помоги!

  • 0
    Почему вы звоните по всей форме?
  • 0
    Я думал, что форма должна инкапсулировать все элементы. Я новичок в HTML и JavaScript, так что я не совсем уверен. Это ссылка на мой jsfiddle: jsfiddle.net/rasikaceg/W3xkL/1
Теги:
jsfiddle

1 ответ

1
Лучший ответ

Вы должны использовать:

<form name="form1" method="post" onSubmit="return myFunction();">

В myFunction вы не вызываете функцию createTable.

Кроме того, любые ошибки в скрипте вызовут форму. Это поведение по умолчанию для форм, и единственный способ исправить это - исправить любые ошибки в скрипте.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню