2013-09-24 4 views
0

Edit: Добавлено JSfiddle лучше продемонстрироватьХорошая практика программирования для назначения прямые значения

Так что я не уверен, если это хороший стиль программирования, но у меня есть таблица с несколькими ячейками и некоторые из них зависят от другие (>, < и т. д.) У меня также есть форма, в которой значения также зависят от других.

Я использую XSLT для генерации этих таблиц/форм динамически из XML.So в зависимости от XML страница будет выглядеть по-разному и иметь разные данные. Проблема в том, должен ли я создавать XML таким образом, чтобы он ссылался на отдельный элемент, от которого он зависит? Таким образом, когда я ввожу значение, я проверю, соответствует ли введенное значение условию зависимости. В этом JsFiddle клетки имеют данные-valueLimits, которые явно говорят, в какой ячейке она должна проверить

<tbody><tr class="tableRow"> 
<td ><input type="Text" id="1102" style="text-align:center;" data-valuelimits="& 
lt;=:1103"/></td> 
<td><input type="Text" id="1103" style="text-align:center;" data-valuelimits="& 
gt;=:1102"/></td> 
</tr></tbody> 
</table> 

Я чувствую, что это немного хаком, потому что я явно говорю, какой элемент он должен проверить.

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

Пример: если я не буду расфокусировать ячейку в столбце 1 строки 1, я запускаю событие, которое просматривает тогда информацию в заголовке столбца, в которой говорится, что этот столбец меньше, чем столбец 2. Поэтому я получаю ячейку в строке столбца 2 1, чтобы проверить, является ли значение в ячейке в столбце 1 строка 1 меньше, чем ячейка в строке столбца 2. Проблема заключается в том, что они должны быть сгруппированы вместе, в то время как элемент может быть где угодно. В этом JsFiddle data-valueLimits находятся в заголовке, и мне придется программно получить информацию о том, какая база столбцов для этой информации и какая строка нечеткой ячейки находится, чтобы получить значение для comapre. Таким образом, мне не нужно знать, какая ячейка это, но местоположение.

<thead><tr> 
<th ><label data-valuelimits="&lt;=:MaxNum" name="MinNum">Min Number</label></th> 
<th class="dataTableHeader"><label data-valuelimits="&gt;=:MinNum" name="MaxNum">Max 
Number</label></th> 
</tr></thead> 

Кто-нибудь знает способ комбинировать оба пути?

+1

Я сомневаюсь, что многие люди прочитают этот блок текста, а затем тех, кто это делает, это действительно не очень ясно. В конце концов, вы, кажется, спрашиваете мнение (* «должен ли я создать XML, чтобы он ссылался на отдельный элемент, от которого он зависит?» *), Который не соответствует теме stackoverflow. –

+2

1000 слов, 0 кодов .. Вы могли бы показать нам свой код или часть его, и это намного лучше, чем объяснять структуру вашей программы. –

+0

@VuralAcar KevinB Я вижу вашу точку Я добавил код, чтобы лучше демостратировать. –

ответ

0

Построение пользовательской проверки контрольной суммы на самом деле довольно просто. Возможно, вы могли бы основываться на существующей структуре, такой как jQuery Validate, но я хотел сохранить все это просто.

Вы можете использовать атрибут data-checksum для элементов, для которых требуется контрольная сумма, и использовать делегирование событий для каждого события blur всех input[type="text"] элементов, имеющих этот атрибут. В моем примере контрольная сумма inputA + inputB означает, что значение должно быть равно сумме полей с именем inputA и inputB соответственно.

Примечание: в некоторых браузерах blur не пузырится, поэтому вы не сможете использовать делегирование событий. Возможно, было бы безопаснее добавлять слушателей событий ко всем элементам.

E.g.

HTML

<input name="inputA" type="text"> 
<input name="inputB" type="text"> 
<input name="inputC" type="text" data-checksum="inputA + inputB"> 

JS

$(function() { 

    var spacesRx = /\s/g, 
     wordBoundaryRx = /\b/, 
     operatorsRx = /[+\-*\\]/; 

    $(document).on('blur', 'input[type=text][data-checksum]', function (e) { 
     var $this = $(e.currentTarget), 

      //default operator 
      operator = '+', 

      //naive parsing of the checksum expression 
      parts = $this.data('checksum').replace(spacesRx, '').split(wordBoundaryRx), 

      //calculate the result of the checksum expression 
      result = parts.reduce(function (res, item) { 
       if (operatorsRx.test(item)) { 
        operator = item; 
        return res; 
       } 

       //evil eval to shorten code example 
       return eval('res' + operator + '=' + ($('input[type=text][name="' + item + '"]').val() || 0)); 

      }, 0); 

     if (result !== parseInt($this.val(), 10)) { 
      console.warn('error, expecting ' + result + ' for field ' + $this.prop('name')); 
     } 
    }); 
}); 

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

EDIT:

да это то, что я имел в виду, но я чувствую, что это очень хаком, так как я нахожусь в каком-то смысле «жесткое кодирование» вещи, такие, как явно говоря это InputA и InputB. Но если это единственный способ, я думаю.

Хорошо, если нет какого-либо алгоритма, который вы можете использовать для определения правил, основанных на единственном знании того, какой элемент проверяется, нет другого способа, кроме указания правил. Если вы не Чак Норрис ...

+0

Да, это то, что я имел в виду, но я чувствую, что он очень хакерский, так как я в некотором смысле «жестко кодирую» вещи, например, явным образом говорю ему inputA и inputB. Но если это единственный способ, я думаю. –

+0

Вы имели в виду '|| 0' или '| 0'? Как и все, ничто не мешает оператору '+' выполнять конкатенацию строк. –

+1

@JackThor, ну как бы вы хотели это определить? У вас есть алгоритм, который можно использовать, например, два поля под текущим полем или что-то подобное? Если вы этого не сделаете, нет другого способа, кроме указания правил. – plalx

Смежные вопросы