Javascript сообщение

Question

У меня проблемы с исправлением кода JS.В коде фрагмента вы можете увидеть мою программу,

Теперь установите первый флажок.Сообщение появляется в нижней части, как только я набираю число в нем, сообщение должно исчезнуть, и текстовое поле не должно отключаться ...

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

Может кто-нибудь дать мне некоторое представление об этом?Должно быть что-то не так в тестовой функции ...

Заранее спасибо.

// JavaScript source code


function test(el)
{
    divOutput = document.getElementById("msgbox2");
    strValideer = "<ul>";
    var txt = document.getElementById(el.id.replace('chk', 'txt'))
    if (el.checked === true ) {
        txt.disabled = false;
        if(txt.value==="")
        {
            strValideer += "<li><b>" + txt.name + ": </b>verplicht veld</li>";
        }
        }
    else if (el.checked === false)
    {
        txt.disabled = true;
      return;

    }

    strValideer += "</ul>";
    divOutput.innerHTML = strValideer;
}

<fieldset>
                <legend>Bestel gegevens</legend>
                <div class="container">
                    <div class="row">
                        <div class="span7" id="houtsoorten">
                            <div class="control-group">
                                <label class="control-label">
                                    bangkirai
                                    <input id="chkbangkirai" type="checkbox" onchange="test(this)" >
                                </label>
                                <div class="controls">
                                    <div class="input-append">
                                        <input class="inpbox input-mini" type="text" id="txtbangkirai" name="bangkirai" placeholder="aantal" disabled oninput="test(this)">
                                        <span class="add-on">stuks</span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    beukenhout
                                    <input id="chkbeukenhout" type="checkbox" onchange="test(this)">
                                </label>
                                <div class="controls">
                                    <div class="input-append">
                                        <input class="inpbox input-mini" type="text" id="txtbeukenhout" name="beukenhout" placeholder="aantal" disabled oninupt="test(this)">
                                        <span class="add-on">stuks</span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    dennenhout
                                    <input id="chkdennenhout" type="checkbox" onchange="test(this)">
                                </label>
                                <div class="controls">
                                    <div class="input-append">
                                        <input class="inpbox input-mini" type="text" id="txtdennenhout" name="dennenhout" placeholder="aantal" disabled oninput="test(this)">
                                        <span class="add-on">stuks</span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    eikenhout
                                    <input id="chkeikenhout" type="checkbox" onclick="test(this)">
                                </label>
                                <div class="controls">
                                    <div class="input-append">
                                        <input class="inpbox input-mini" type="text" id="txteikenhout" name="eikenhout" placeholder="aantal" disabled oninput="test(this)">
                                        <span class="add-on">stuks</span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    kastanjehout
                                    <input id="chkkastanjehout" type="checkbox" onchange="test(this)">
                                </label>
                                <div class="controls">
                                    <div class="input-append">
                                        <input class="inpbox input-mini" type="text" id="txtkastanjehout" name="kastanjehout" placeholder="aantal" disabled oninput="test(this)">
                                        <span class="add-on">stuks</span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    lindehout
                                    <input id="chklindehout" type="checkbox" onchange="test(this)">
                                </label>
                                <div class="controls">
                                    <div class="input-append">
                                        <input class="inpbox input-mini" type="text" id="txtlindehout" name="lindehout" placeholder="aantal" disabled oninput="test(this)">
                                        <span class="add-on">stuks</span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    notenhout
                                    <input id="chknotenhout" type="checkbox" onchange="test(this)">
                                </label>
                                <div class="controls">
                                    <div class="input-append inline">
                                        <input class="inpbox input-mini" type="text" id="txtnotenhout" name="notenhout" placeholder="aantal" disabled oninput="test(this)">
                                        <span class="add-on">stuks</span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    rubberhout
                                    <input id="chkrubberhout" type="checkbox" onchange="test(this)">
                                </label>
                                <div class="controls">
                                    <div class="input-append inline">
                                        <input class="inpbox input-mini" type="text" id="txtrubberhout" name="rubberhout" placeholder="aantal" disabled oninput="test(this)">
                                        <span class="add-on">stuks</span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    Cederhout
                                    <input id="chkCederhout" type="checkbox" onchange="test(this)">
                                </label>
                                <div class="controls">
                                    <div class="input-append inline">
                                        <input class="inpbox input-mini" type="text" id="txtCederhout" name="Cederhout" placeholder="kg" disabled oninput="test(this)">
                                        <span class="add-on">kg</span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">betalingswijze</label>
                                <div class="controls">
                                    <label class="radio">
                                        <input type="radio" name="optionsRadios" id="visa" value="visa">
                                        visa
                                    </label>
                                    <label class="radio">
                                        <input type="radio" name="optionsRadios" id="overschrijving" value="overschrijving">
                                        overschrijving
                                    </label>
                                    <label class="radio">
                                        <input type="radio" name="optionsRadios" id="cash" value="cash">
                                        cash
                                    </label>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">opmerkingen:</label>
                                <div class="controls">
                                    <textarea rows="5" placeholder="opmerkingen"></textarea>
                                </div>
                            </div>
                        </div>
                        <div class="span4 valid">
                            <div id="msgbox2" class="alert alert-error" style="display: block;">validatie bestelgegevens verschijnt hier
                        </div>
                        <div class="span1"><!--lege kolom--></div>
                        <!--einde row-->
                    </div>
                    <!--einde container-->
                  </div>
                </div>
            </fieldset>

Answer 1

Вы должны проверить детей сначала у него есть узлы или нет. Проверьте функцию, она будет работать сейчас

var list = [];
function test(el) {
    divOutput = document.getElementById("msgbox2");
    strValideer = "<ul>";
    var txt = document.getElementById(el.id.replace('chk', 'txt'));
    if (el.checked === true) {
        txt.disabled = false;
        if (txt.value === "") {
            list.push(txt.name);
        }
    }
    else if (el.checked === false) {
        txt.disabled = true;
        list.splice(list.indexOf(txt.name), 1);
    }
    for (var i = 0; i < list.length; i++) {
        strValideer += "<li><b>" + list[i] + ": </b>verplicht veld</li>";
    }
    strValideer += "</ul>";
    divOutput.innerHTML = strValideer;
}