2011-12-21 2 views
3

Я пытаюсь отформатировать весь столбец таблицы, заменив данные в каждой ячейке на строку. Просто, если я вводю «наглы» в поле ввода и нажмите кнопку форматирования в верхней части столбца таблицы, текст в каждой ячейке в этом столбце заменяется на «nargles». Это работает нормально.jQuery string replace match regex

Мой вопрос заключается в замене экземпляров «% 0», «% 1», «% 2» и т. Д. Во входной строке со значениями таблицы. % 0 соответствует 0-му столбцу,% 1 для 1-го столбца,% 2 для 2-го и т. Д. Кроме того, он должен захватить значение столбца для текущей строки, которая изменяется.

Для уточнения с примера, давайте возьмем таблицу:

1 cat  description 
2 dog  description 
3 fish description 

Если я вошел в «Строка% 0% 1» для моего входа и выполнил его на 3-й колонке, то результат будет:

1 cat  Row 1 is for cat 
2 dog  Row 2 is for dog 
3 fish Row 3 is for fish 

Надеется, что это достаточное объяснение =)

Итак, вот пример в примере таблице:

<tr> 
    <td></td> 
    <td><button class="format" col="1">Format Col</button></td> 
    <td><button class="format" col="2" >Format Col</button></td> 
</tr> 

<tr> 
    <td><input type="text" col="0" row="0" value="0" size="1"></td> 
    <td><input type="text" col="1" row="0" value="cat" /></td> 
    <td><input type="text" col="2" row="0" value="description" /></td> 
</tr> 

... 

и вот код для кнопки формата в верхней части каждой колонки

$('td button.format').on('click', function() { 

    // get formatter variables and column number 
    string = $("#formatter").attr("value"); 
    column = $(this).attr("col"); 

    // regex to globally look for %d (where d is an integer) 
    var re = new RegExp("\%(\\d+)", "g"); 

    $('td input[col="' + column + '"]').each(function (row) { 
     // replace string here 
    }); 
}); 

В настоящее время эта структура кода будет фиксировать значения 1-го столбца и работает отлично

$('td input[col="' + column + '"]').each(function (i) { 
    $(this).attr("value", string.replace(re, $('td input[col="1" row="' + i +'"]').attr('value'))); 
}); 

Но делать что-то вроде этого (с входом «% 2») приведет к «undefined 2». (Я заменил col="1" выше на col="\$1" и добавил «\ $ 1», чтобы найти первое совпадающее регулярное выражение). Я также должен отметить, что в дополнение к «\ $ 1» я использовал «$ 1» и «\ $ 1» без везения.

$('td input[col="' + column + '"]').each(function (i) { 
    $(this).attr("value", string.replace(re, $('td input[col="\$1" row="' + i +'"]').attr('value') + " \$1")); 
}); 

Мой вывод заключается в том, что время, в котором регулярное выражение матч подставляется в Jquery поиска и время, когда выполняется поиск не является правильным. Поскольку результат «undefined 2», я знаю, что регулярное выражение соответствует, но поиск неверен. Тем не менее, я знаю, что код в целом правильный, так как hardcoding col="2" будет работать.

Любые мысли о том, почему это вызывает проблемы. Я хочу сказать, что это проблема синтаксиса, но, возможно, я ошибаюсь.

Sidenote: Этого можно избежать, если я только что использовал функцию re.match() и повторил по возвращенному массиву. Я знаю, что существует решение, и я просто вижу, есть ли более элегантный/чистый способ сделать это.

Я знаю, что это долго, извините! Я считаю, что больше информации лучше, чем недостаточно. Спасибо, что прочитали весь путь!

ответ

5

Я предполагаю, что вы ищете что-то вроде этого:

$('td button.format').click(function() { 
    var template = "Row %0 is for %1"; 
    var col = $(this).attr("col"); 

    $("#body tr").each(function() { 
     var $row = $(this); 
     var t = template.replace(/%(\d+)/g, function($0, $1) { 
      return $row.find("td:eq(" + $1 + ") input").val(); 
     }); 
     $row.find("td:eq(" + col + ") input").val(t) 
    }) 
}) 

Полный пример: http://jsfiddle.net/TTjtU/

+1

Вы полны удивительным. Решение является блестящим, и вы также познакомили меня с jsfiddle, который, кажется, потрясающий сайт. Где я пишу пиво? –

+0

Рад, что это сработало, @Scotty;) – georg