Строка таблицы клонов и математическая функция в jquery - как правильно решать? - PullRequest
Новая
       7

Строка таблицы клонов и математическая функция в jquery - как правильно решать?

0 голосов
/ 16 декабря 2011

Не знаю с чего начать?

(текстовое поле A / текстовое поле B) = текстовое поле C

И автоматически повторить / клонировать эту строку таблицы .change на keyup текстового поля B. В основном это означает, что после первого вычисления появится другая строка с уникальными идентификаторами и т. Д. 

<table>
  <tr>
   <td><input type="text" id="A" name="A"></td>
   <td><input type="text" id="B" name="B"></td>
   <td><input type="text" id="C" name="C" value=""></td>
  </tr>
</table>


// Clone table rows
$(function() {
    var i = 1;
    $("#A").clone(function() {
               $("table tr:first").clone(true).find("input").each(function() {
            $(this).val('').attr('id', function(_, id) { return id + i });
            $(this).val('').attr('name', function(_, name) { return name + i });
            }).end().appendTo("table");

        i++;

        $("#C").val(Math.round(($("#A").val() / $("#B").val()) * 100 )+ "%");

    });

});

Ответы [ 2 ]

3 голосов
/ 16 декабря 2011

Я очень старался понять твой вопрос.Я интерпретировал ваш вопрос следующим образом:

  • В случае A или B вычислите A / B и поместите результат в C
  • При изменении B добавьте новую строку суникальные идентификаторы.
  • Продолжить.

DEMO: http://jsfiddle.net/vpsv9/

HTML: 

<table id="math-table">
  <tr>
   <td><input type="text" id="A1" name="A"></td>
   <td><input type="text" id="B1" name="B"></td>
   <td><input type="text" id="C1" name="C" value=""></td>
  </tr>
</table>

JavaScript: 

// The first requirement
$("#math-table input").live("keyup", function(){
    var id = this.id.match(/\d+/);
    $("#C"+id).val(  $("#A"+id).val() / $("#B"+id).val()  );
});

// The second requirement:
var uniqueIds = $("#math-table tr").length;
$("#math-table input[id^='B']").live("change", function(){
    var $thisRow = $(this).closest("tr"),
        $clone = $thisRow.clone(),             // Clone row
        $inputs = $clone.find("input").val("");// Reset values, return all inputs
    uniqueIds++; //Increment ID
    $inputs[0].id = "A" + uniqueIds;
    $inputs[1].id = "B" + uniqueIds;
    $inputs[2].id = "C" + uniqueIds;
  //$inputs.eq(0).focus();           // Optionally, focus on the next input field
    $thisRow.after($clone);                    // Add row after current one
});
0 голосов
/ 16 декабря 2011

Fwiw, у меня есть это решение, которое очень близко к ответу Роба: http://jsfiddle.net/49DGP/2/

...