回答編集履歴
2
テキスト修正
answer
CHANGED
@@ -62,7 +62,7 @@
|
|
62
62
|
});
|
63
63
|
});
|
64
64
|
```
|
65
|
-
上記のように、`remove` する前に、削除される行のインデクスを取っておき、削除した後に、そのインデクスの行も含めた以降の行について、`
|
65
|
+
上記のように、`remove` する前に、削除される行のインデクスを取っておき、削除した後に、そのインデクスの行も含めた以降の行について、`setInputsAttrs` を実行します。
|
66
66
|
|
67
67
|
以下は、上記の修正後のコードの動作確認用に CodePen に上げたものです。
|
68
68
|
|
1
テキスト修正
answer
CHANGED
@@ -5,7 +5,7 @@
|
|
5
5
|
まず、あるjQueryオブジェクトに対する操作として、当該要素の内側にある `<input>` の `name`属性 と `id` 属性を、 与えられた引数 `idx` から得られる規則的な値に上書きするプラグインを作成します。
|
6
6
|
|
7
7
|
```javascript
|
8
|
-
$.fn.
|
8
|
+
$.fn.setInputsAttrs = function(idx) {
|
9
9
|
$('input', this).each(function(i, e) {
|
10
10
|
const value = `hoge${i > 0 ? i+1 : ''}${idx}`;
|
11
11
|
$(e).attr({
|
@@ -18,7 +18,7 @@
|
|
18
18
|
|
19
19
|
これによって、 ある `<tr>` を参照する `e` があったときに、例えば
|
20
20
|
```javascript
|
21
|
-
$(e).
|
21
|
+
$(e).setInputsAttrs(5);
|
22
22
|
```
|
23
23
|
とすると、この`<tr>` の中に出現する最初 `<input>` の `name`属性 と `id` 属性の値は、 **hoge5** になり、2番目の`<input>` については **hoge25**、3番目の`<input>` については **hoge35** になります。
|
24
24
|
|
@@ -44,7 +44,7 @@
|
|
44
44
|
```javascript
|
45
45
|
$("#hoge_add").click(function() {
|
46
46
|
var rowsCount = $("#hoge_table > tbody > tr").length;
|
47
|
-
addRow().
|
47
|
+
addRow().setInputsAttrs(rowsCount + 1);
|
48
48
|
});
|
49
49
|
```
|
50
50
|
|
@@ -58,7 +58,7 @@
|
|
58
58
|
$(row).remove();
|
59
59
|
|
60
60
|
$('tr').each(function(i, e) {
|
61
|
-
if (i >= removedIndex) $(e).
|
61
|
+
if (i >= removedIndex) $(e).setInputsAttrs(i + 1);
|
62
62
|
});
|
63
63
|
});
|
64
64
|
```
|