Расширенные флажки с Javascript - PullRequest
0 голосов
/ 05 августа 2011

У меня есть форма, которая представляет собой таблицу, созданную с помощью php для извлечения информации из базы данных. В них у меня есть флажок, который при щелчке извлекает значениеtimateCost и добавляет его в функцию JavaScript, которая вычисляет его и сохраняет промежуточную сумму всех проверенных объектов.

То, что я пытаюсь сделать, это создать галочку all и снять галочку с опции all, которая все равно будет передавать необходимые переменные в другие функции javascript. Позвольте мне продемонстрировать с некоторым кодом:

Это рисует флажок рядом с заголовком.

foreach($replace as $key => $value)
  {
    $jScript = 'onclick=\'calcTotals("'.$replace[$key]['estimatedCost'].'","'.$replace[$key]['optionItem_id_replaceOrRepair'].'","'.$replace[$key]['service_title'].'","'.$replace[$key]['maintenanceitem_id'].'");\'';
    $checkbox = sprintf('<input type="checkBox" name="ids[]" id="%s" value="%s" %s>', $replace[$key]['maintenanceitem_id'], $replace[$key]['maintenanceitem_id'], $jScript).'&nbsp;';
    $replace[$key]['title'] = $checkbox.$replace[$key]['title'];
    $replace[$key]['estimatedCost'] =  $replace[$key]['estimatedCost'];
  } 

Это текущая проверка всех и снять все ссылки:

echo '<a href="#" onClick=\'setCheckboxes("budgeting", true); return false;\'>Check All</a>&nbsp;|&nbsp;';
  echo '<a href="#" onClick=\'setCheckboxes("budgeting", false); return false;\'>Uncheck All</a>';

Теперь текущие функции, которые у меня есть в JavaScript:

function setBudgetCheckboxes(the_form, do_check) {
        var elts      = (typeof(document.forms[the_form].elements['ids[]']) != 'undefined')
                      ? document.forms[the_form].elements['ids[]']
                      : (typeof(document.forms[the_form].elements['ids[]']) != 'undefined')
              ? document.forms[the_form].elements['ids[]']
              : document.forms[the_form].elements['ids[]'];
        var elts_cnt  = (typeof(elts.length) != 'undefined')
                      ? elts.length
                      : 0;
        if (elts_cnt) {
            for (var i = 0; i < elts_cnt; i++) {
                elts[i].checked = do_check;
                var name = document.getElementById(name);
            } // end for
        } else {
            elts.checked = do_check;
        } // end if... else
        return true;
    }

А другой, который обрабатывает клики по одному:

function calcTotals(amount, type, service, name) {
        if(amount[0] == '$') {
            amount = amount.substr(1,amount.length);
        }
        var id = type+"_"+service+"_selected";
        var grand_id = "Grand_selected";
        var grand_service_id = "Grand_"+service+"_selected";
        var type_id = type+"_selected";

        var checked = document.getElementById(name).checked;

        var multiplier = -1;

        if(checked) {
            multiplier = 1;
        }

        amount = amount * multiplier;

        addBudgetValue(amount, id);
        addBudgetValue(amount, grand_id);
        addBudgetValue(amount, grand_id+"_h");
        addBudgetValue(amount, type_id);
        addBudgetValue(amount, grand_service_id);
        addBudgetValue(amount, grand_service_id+"_h");
    }
function addBudgetValue(amount, id) {
        var current_value = document.getElementById(id).innerHTML;
        var curtmp = 0;
        if(current_value == "$0") {
            current_value = amount;
        }
        else {
            curtmp = parseFloat(current_value.substr(1,current_value.length));
            current_value = (curtmp+parseFloat(amount));
        }   
        var newVal = "$"+Number(current_value).toFixed(2);
        if(newVal == "$0.00")
            newVal = "$0";  
        document.getElementById(id).innerHTML = newVal;
    }

Таким образом, вопрос заключается в следующем: как вы можете установить флажок «все» для проверки всех полей и передать информацию в функцию calcTotals, чтобы значения были добавлены правильно?

Ответы [ 2 ]

1 голос
/ 05 августа 2011

Вот jsfiddle, который делает то, что (я думаю) вы ищете: http://jsfiddle.net/kz9gU/1/

Я использую пользовательский атрибут data-* для хранения оценочной стоимости (соответствует спецификации в соответствии с HTML5), поэтому он определен в тегах флажков. Каждый флажок затем вызывает функцию updateTotal(), когда отмечен / не отмечен, но не передает никаких аргументов. updateTotal() затем проходит по флажкам, считывая каждую сумму из атрибута data-cost, и отображает сумму.

функциям check / uncheck не нужно вычислять какие-либо значения; они просто все проверяют / снимают и потом звонят updateTotal().

Редактировать: Хех, только что понял, что вы не используете jQuery. Я только начинаю воспринимать jQuery как должное, хотя сам на самом деле не использую jQuery. То, что вы видите в скрипке, вероятно, самая длинная часть JS на основе jQuery, на самом деле я написал:)
Во всяком случае, почти всегда неплохо использовать какую-то библиотеку для сглаживания различий в браузерах, и сейчас jQuery - король кучи.

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

0 голосов
/ 05 августа 2011

Надеюсь, я вас правильно понял, вы хотите включить / отключить все функции?http://jetlogs.org/jquery/jquery_select_all.html после этого получите массив флажков с php и передайте информацию, в PHP выполните цикл, чтобы проверить значения массива и выполнить ваши операторы.

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