сравнить флажок двух форм установлен или нет - PullRequest
Новая
       2

сравнить флажок двух форм установлен или нет

0 голосов
/ 28 апреля 2011

У меня есть две или более формы. и каждая форма содержит некоторый флажок и значение проверки, показанное в текстовом поле. Я хочу, чтобы при проверке какого-либо флажка общее значение отображалось в текстовом поле в этой форме. Я хочу, чтобы при установке флажка в одной из форм флажок другой формы не устанавливался и возвращал предупреждение . вот мой код: 

<head>
<script>function UpdateCost() {
  var sum = 0;
  var gn, elem;
  for (i=0; i<5; i++) {
    gn = 'budget'+i;
    elem = document.getElementById(gn);
    if (elem.checked == true) { sum += Number(elem.value); }
  }
  document.getElementById('totalcost').value = sum.toFixed(2);
} 
</script>
</head>

<body>
// 1st form
<form name= "form1">
<input type="checkbox" id='budget0' value="9.99"  onclick="UpdateCost()">Game 1 ( 9.99)<br>
<input type="checkbox" id='budget1' value="19.99" onclick="UpdateCost()">Game 2 (19.99)<br>
<input type="checkbox" id='budget2' value="27.50" onclick="UpdateCost()">Game 3 (27.50)<br>
<input type="checkbox" id='budget3' value="45.65" onclick="UpdateCost()">Game 4 (45.65)<br>
<input type="checkbox" id='budget4' value="87.20" onclick="UpdateCost()">Game 5 (87.20)<br>
<input type="text" id="totalcost" value="">// total budget
</form>
// 2nd form
<form name= "form2">
<input type="checkbox" id='budget0' value="9.99"  onclick="UpdateCost()">Game 1 ( 9.99)<br>
<input type="checkbox" id='budget1' value="19.99" onclick="UpdateCost()">Game 2 (19.99)<br>
<input type="checkbox" id='budget2' value="27.50" onclick="UpdateCost()">Game 3 (27.50)<br>
<input type="checkbox" id='budget3' value="45.65" onclick="UpdateCost()">Game 4 (45.65)<br>
<input type="checkbox" id='budget4' value="87.20" onclick="UpdateCost()">Game 5 (87.20)<br>
<input type="text" id="totalcost" value="">// total budget
</form>

</body>

Ответы [ 3 ]

2 голосов
/ 28 апреля 2011

Fistr of all - идентификатор должен быть уникальным - нельзя добавить два элемента с одинаковым идентификатором.

Измените их на name="budget[0]" и так далее. То же самое с totalcost -> name="totalcost".

Затем измените вашу функцию на: 

function UpdateCost(input) {
    var elements = input.form.elements;
    var sum = 0;
    var resultElement;

    for ( var i = 0; i < elements.length; i++ ) {
        var element = elements[i];
        if ( element.type == 'checkbox' && element.checked ) {
            sum += parseFloat( element.value );
        } else if ( element.type == 'text' ) {
            resultElement = element;
        }
    }

    element.value = sum;
}

А теперь измените onclick события на onclick="UpdateCost(this)"

1 голос
/ 28 апреля 2011

Посмотрите на библиотеки JQuery или Prototype Javascript. Они были созданы для того, чтобы делать такие вещи, и должны облегчать им задачу.

0 голосов
/ 28 апреля 2011

Прежде всего идентификатор должен быть уникальным , поэтому, например, добавьте форму к идентификатору.

Более того, сообщите функции UpdateCost, над какой формой вы работаете, добавив параметр

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

<head>
<script>

    var only_allowed_for = '';

    function UpdateCost(form) {
        if (only_allowed_for == '') {

            only_allowed_for = form;

        }

        var sum = 0;
        var gn, elem;
        for (i=0; i<5; i++) {

            gn = form + '_budget'+ i;
            elem = document.getElementById(gn);

            if (elem.checked == true)
                if (only_allowed_for == form) {
                    sum += Number(elem.value);
                } else {

                    elem.checked = false;

                }

          }
          document.getElementById(form + '_totalcost').value = sum.toFixed(2);
    } 
</script>
</head>

<body>
// 1st form
<form name= "form1">
<input type="checkbox" id='form1_budget0' value="9.99"  onclick="UpdateCost('form1')">Game 1 ( 9.99)<br>
<input type="checkbox" id='form1_budget1' value="19.99" onclick="UpdateCost('form1')">Game 2 (19.99)<br>
<input type="checkbox" id='form1_budget2' value="27.50" onclick="UpdateCost('form1')">Game 3 (27.50)<br>
<input type="checkbox" id='form1_budget3' value="45.65" onclick="UpdateCost('form1')">Game 4 (45.65)<br>
<input type="checkbox" id='form1_budget4' value="87.20" onclick="UpdateCost('form1')">Game 5 (87.20)<br>
<input type="text" id="form1_totalcost" value="0.00">// total budget
</form>
// 2nd form
<form name= "form2">
<input type="checkbox" id='form2_budget0' value="9.99"  onclick="UpdateCost('form2')">Game 1 ( 9.99)<br>
<input type="checkbox" id='form2_budget1' value="19.99" onclick="UpdateCost('form2')">Game 2 (19.99)<br>
<input type="checkbox" id='form2_budget2' value="27.50" onclick="UpdateCost('form2')">Game 3 (27.50)<br>
<input type="checkbox" id='form2_budget3' value="45.65" onclick="UpdateCost('form2')">Game 4 (45.65)<br>
<input type="checkbox" id='form2_budget4' value="87.20" onclick="UpdateCost('form2')">Game 5 (87.20)<br>
<input type="text" id="form2_totalcost" value="0.00">// total budget
</form>

</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...