Динамический подсчет в таблице
 

нашел решение вопроса ,подобному моему, но толком не осознал, может кто пояснит?
http://javascript.ru/forum/jquery/33...podscheta.html
делаю магазин.
при статичном коде - обсчитываю и изменяю поля, как мне требуется.
при попытке добавления блока элементов, мой скрипт подсчета требуется поменять, а как не могу понять.
Код:

<script type="text/javascript">
    function TotalSum() {
      if(1) {
        // Расчитываем сумму покупки
        var mail12 = document.getElementById('mail_12').value; // Количество единиц товара
        var mail50 = document.getElementById('mail_50').value; // Цена одной единицы
        var mail54 = document.getElementById('mail_54').value; // Вес покупки
        var tot = mail12*mail50;
        // Расчитываем итоговую сумму
        var mail53 = tot; // Общая сумма покупки
        var input155 = document.getElementById('input_155').value; // Курс юаня
        input155 = input155.replace(",",".");
        //total = (tot*+input155+25*+input155)+(tot*+input155+25*+input155)*0.25+(mail54*170);
        total = (tot*+input155)+(tot*+input155)*0.15+(mail54*250);
        tot = accounting.formatMoney(tot, "RUR", 2, " ", ",", "%v %s"); // подставляем его в поле на странице
        document.getElementById('mail_53').value = tot;
        total = accounting.formatMoney(total, "RUR", 2, " ", ",", "%v %s");
        document.getElementById('mail_56').value = total; // подставляем его в поле на странице
        //alert('total = ' +total);
      };
    }
  </script>

Часть кода HTML, которые этот скрипт обсчитывает:

<ul>
<!-- duplicate -->
<li>
<div style="position: relative;">
<a name="top"></a>
        <table id="table_container"></table>
        <br />
        <a href="#top"><img style="background: url('/images/stories/apply.gif') no-repeat
         scroll 80px -5px transparent;" alt="Добавить товар" id="add" onclick="return add_new_image();">
         </a>
        <br />
</div>
</li>
<!-- /duplicate -->
  </ul>

вот этим скриптом добавляю эту и последующие части блока:

var total = 0;
  function add_new_image(){
    total++;
    jQuery('<tr>')
    .attr('id','tr_image_'+total)
    .css({lineHeight:'20px'})
/* td */
    .append (
      jQuery('<td>')
      .attr('id','td_title_'+total)
      .css({paddingRight:'5px',width:'auto',border:'1px solid'})

/* li */
    .append (
      jQuery('<li>') .attr('id','id_'+(8+total)) .attr('class','form-line form-line-column')

/* div */
      .append(
        jQuery('<div>') .attr('id','cid_'+(8+total)) .attr('class','form-input form_element cf_textbox-wide')
        .append(
          jQuery('<label>Ссылка на страницу:<span class="form-required">*</span></label>')
          .attr('id','label_'+(8+total)) .attr('class','form-label-wide') .attr('for','mail_'+(8+total))
        )
        .append(
          jQuery('<input type="text" />')
          .attr('id','mail_'+(8+total)) .attr('name','mail_'+(8+total)) .attr('class','form-textbox validate[required]')
          .attr('data-type','input-textbox') .attr('tabindex',5+total) .attr('size','30') .attr('value','')
        )
      )
      .append(
        jQuery('<div>')
        .attr('id','cid_'+(9+total)) .attr('class','form-input form_element cf_textbox-wide')
        .append(
          jQuery('<label>Ссылка на изображение:</label>')
          .attr('id','label_'+(9+total)) .attr('class','form-label-wide') .attr('for','mail_'+(9+total))
        )
        .append(
          jQuery('<input type="text" />')
          .attr('id','mail_'+(9+total)) .attr('name','mail_'+(9+total)) .attr('class','cf_inputbox form-textbox') .attr('data-type','input-textbox')
          .attr('tabindex',6+total) .attr('size','30') .attr('title','введите адрес страницы с изображенем') .attr('maxlength','150')
        )
      )
/* /div */
//    )
/* /li */

/* li */
//    .append (
//      jQuery('<li>') .attr('id','id_'+(7+total)) .attr('class','form-line form-line-column')

/* div */
      .append(
        jQuery('<div>') .attr('class','form-input form_element cf_textbox-wide')
        .append(
          jQuery('<label>Размер:</label>')
          .attr('class','form-label-wide')
        )
        .append(
          jQuery('<input type="text" />')
          .attr('id','text_'+(7+total)) .attr('name','text_'+(7+total)) .attr('class','cf_inputbox required')
          .attr('tabindex',7+total) .attr('size','30') .attr('maxlength','80') .attr('title','введите размер товара')
        )
      )
      .append(
        jQuery('<div>') .attr('class','form-input form_element cf_textbox-wide')
        .append(
          jQuery('<label>Цвет:</label>')
          .attr('id','label_'+(8+total)) .attr('class','cf_inputbox required')
        )
        .append(
          jQuery('<input type="text" />')
          .attr('id','text_'+(8+total)) .attr('name','text_'+(8+total)) .attr('class','cf_inputbox required')
          .attr('tabindex',8+total) .attr('size','30') .attr('title','введите цвет товара') .attr('maxlength','150')
        )
      )
/* /div */
//    )
/* /li */

/* li */
//    .append (
//      jQuery('<li>') .attr('id','id_'+(11+total)) .attr('class','form-line form-line-column')

/* div */
      .append(
        jQuery('<div>') .attr('id','cid_'+(11+(11+total))) .attr('class','form-input form_element cf_textbox-wide')
        .append(
          jQuery('<label>Количество:<span class="form-required">*</span></label>')
          .attr('id','label_'+(11+total)) .attr('class','form-label-wide') .attr('for','mail_units_'+(+total))
        )
        .append(
          jQuery('<input type="text" />')
          .attr('id','mail_units_'+(+total)) .attr('name','mail_units_'+(+total)) .attr('class','form-textbox validate[required, Numeric]')
          .attr('data-type','input-textbox') .attr('tabindex',9+total) .attr('size','30') .attr('value','')
          .attr('onkeyup','TotalSum()')
        )
      )

      .append(
        jQuery('<div>') .attr('id','cid_'+(49+(49+total))) .attr('class','form-input form_element cf_textbox-wide')
        .append(
          jQuery('<label>Цена за единицу ¥:<span class="form-required">*</span></label>')
          .attr('id','label_'+(49+total)) .attr('class','form-label-wide') .attr('for','mail_'+(49+total))
        )
        .append(
          jQuery('<input type="text" />')
          .attr('id','mail_'+(49+total)) .attr('name','mail_'+(49+total)) .attr('class','form-textbox validate[required, Numeric]')
          .attr('data-type','input-textbox') .attr('tabindex',10+total) .attr('size','30') .attr('value','')
          .attr('onkeyup','TotalSum()')
        )
      )
/* /div */
//    )
/* /li */

/* li */
//    .append (
//      jQuery('<li>') .attr('id','id_'+(53+total)) .attr('class','form-line form-line-column')

/* div */
      .append(
        jQuery('<div>') .attr('id','cid_'+(53+(53+total))) .attr('class','form-input form_element cf_textbox-wide')
        .append(
          jQuery('<label>Вес:<span class="form-required">*</span></label>')
          .attr('id','label_'+(53+total)) .attr('class','form-label-wide') .attr('for','mail_'+(53+total))
        )
        .append(
          jQuery('<input type="text" />')
          .attr('id','mail_'+(53+total)) .attr('name','mail_'+(53+total)) .attr('class','form-textbox validate[required, Numeric]')
          .attr('data-type','input-textbox') .attr('tabindex',11+total) .attr('size','30') .attr('value','0') .attr('maxlength','6')
          .attr('onkeyup','TotalSum()')
        )
      )
/* /div */
    )
/* /li */

    )
/* /td */
    .append(
        jQuery('<td>')
        .css({width:'30px',paddingRight:'5px',textAlign:'left',verticalAlign:'top'})
//        .css({width:'30px',text-align:'center',vertical-align:'top'})
//      .css({paddingRight:'5px',width:'auto',border:'1px solid'})
        .append(
           jQuery('<span id="progress_'+total+'" class="padding5px"><a href="#" onclick="jQuery(\'#tr_image_'+total+'\').remove();" class="ico_delete"><img src="/images/add_image/delete.png" alt="del" border="0"></a></span>')
         )
     )
     .appendTo('#table_container');
}
$(document).ready(function() {
    add_new_image();
});

а вот обсчитать добавляемую часть кода уже мозгов не хватает ((
при каждом добавлении элементы id меняются, блоки могут добавляться и удаляться - значит и нумерация элементов тоже измениться!
думал добавлять вместе с кодом HTML и код JS, который обсчитывает добавляемый блок, но не уверен, что это правильное решение.

muraig,
Воу, Воу! очень много кода. Честно говоря неохота столько читать и разбираться.

Вы опубликовали очень много кода.

Пожалуйста, локализуйте проблему!

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

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

Спасибо.

P.S. код форматируют специальные теги [ js ] ... [/js], [ html ] ... [/html] и другие аналогичные, сам. http://javascript.ru/formatting

Для добавления блоков верстки есть шаблонизаторы (я например пользую underscore) они позволяют заменить простыню аппендов 1-й или двумя строками

спасибо за ответ!
теги [ js ] ... [/js], [ html ] ... [/html] я применил в данном сообщении.
"заменить простыню аппендов " - это я пока еще не могу реализовать, слишком большая разница между perl и js, не понимаю как можно сделать.
Суть:
1. С помощью JS формирую таблицу с динамически назначаемыми ID
2. Необходимо просчитать ячейки таблицы и вывести результат в ячейку.
3. Не могу сообразить как просчитывать ячейки, ID которых, еще не известны(формируются динамически)
При известных ID я это делаю с помощью имеющегося кода JS

У тебя есть таблица. В ней есть строки и столбцы. Вот это и используй.

пытаюсь реализовать такой код:

var content = jQuery('#sale');
counterHtml = jQuery('script', content).next().clone().wrap('<script type="text/javascript"></script>');
jQuery('.form').prepend("<script>" +counterHtml+ "</script>");

выдает ошибку:
SyntaxError: missing ] after element list
вообще в другом файле:
jquery.min.js:1
я хочу добавить код скрипта для обсчета ячеек вот так:

jQuery('.form').prepend('<script type="text/javascript">\
function TotalSum+total() {\
var mail12 = document.getElementById(\'mail_units_\'+total).value;\
var mail50 = document.getElementById(\'mail_50\'+total).value;\
var mail54 = document.getElementById(\'mail_54\'+total).value;\
var tot = mail12*mail50;\
var mail53 = tot;\
var input155 = document.getElementById(\'input_155\'+total).value;\
input155 = input155.replace(",",".");\
total = (tot*+input155)+(tot*+input155)*0.15+(mail54*250);\
tot = accounting.formatMoney(tot, "RUR", 2, " ", ",", "%v %s");\
document.getElementById(\'mail_53\'+total).value = tot;\
total = accounting.formatMoney(total, "RUR", 2, " ", ",", "%v %s");\
document.getElementById(\'mail_56\'+total).value = total;\
}\
</script>');

что бы переменную +total использовать и для идентификации ID и для изменения скрипта.
не получается.

решил свой вопрос о создании скрипта на странице с изменяемым содержимым:

var newScript = document.createElement("script");
    newScript.type = "text/javascript";
    var txt = 'txt 1' +total;
    newScript.text = '\n\
function TotalSum'+ total +'() {\n'+
'var mail12 = document.getElementById(\'mail_units_'+(+total)+'\').value;\n\
var mail50 = document.getElementById(\'mail_'+50+(+total)+'\').value;\n\
var mail54 = document.getElementById(\'mail_'+54+(+total)+'\').value;\n\
var tot = mail12*mail50;\n\
var mail53 = tot;\n\
var input155 = document.getElementById(\'input_'+155+(+total)+'\').value;\n\
input155 = input155.replace(",",".");\n\
total = (tot*+input155)+(tot*+input155)*0.15+(mail54*250);\n\
tot = accounting.formatMoney(tot, "RUR", 2, " ", ",", "%v %s");\n\
document.getElementById(\'mail_'+53+(+total)+'\').value = tot;\n\
total = accounting.formatMoney(total, "RUR", 2, " ", ",", "%v %s");\n\
document.getElementById(\'mail_'+56+(+total)+'\').value = total;\n\
}\n\
';
jQuery('.form').prepend(newScript);

Переменная total менят значение вместе с этим добавляется именно тот скрипт, что требуется.