Saya memiliki masalah berikut: Saya memiliki elemen Jquery Tournament.player dengan data berikut:

<div class="row mb-2">
  <div class="col">
    <input name="players[2][nickname]" type="text" class="form-control" id="p_nickname" placeholder="Nickname" value="Player3">
  </div>
  <div class="col p_region" style="">
    <select name="players[2][region]" class="form-control">
      <option value="" disabled="" selected="">Choose region</option>
    </select>
  </div>
  <div class="col-2">
    <button type="button" class="w-100 btn-sm btn-danger deleteRow">Delete</button>
  </div>
</div>

Saya ingin menambah penghitung dalam atribut name dari elemen pilih dan input dalam.

Itulah yang saya coba sejauh ini:

var newPlayer = Tournament.player.clone().find('input, select').attr("name", function(i, name) {
  return name.replace(/(\d+)/, function($0, $1) {
    return +$1 + 1;
  });
});
newPlayer.appendTo(".players");

Itu melakukan apa yang saya butuhkan, tetapi hanya mengembalikan elemen pilih dan input, seperti:

<input name="players[3][nickname]" type="text" class="form-control" id="p_nickname" placeholder="Nickname" value="">
<select name="players[3][region]" class="form-control" disabled="">
  <option value="" disabled="" selected="">Choose region</option>                                                                               
</select>

Apa yang saya lakukan salah? Saya ingin mendapatkan elemen yang sama dengan yang saya miliki sebelumnya, tetapi hanya mendapatkan sebagian saja.

Terima kasih banyak sebelumnya.

1
Kirill Adamuk 29 Oktober 2019, 17:57

1 menjawab

Jawaban Terbaik

Maksud Anda ini:

const Tournament = {
  player: $(".mb-2")
}

var newPlayer = Tournament.player.clone();
newPlayer.find('input, select').attr("name", function(i, name) {
  return name.replace(/(\d+)/, function($0, $1) {
    return +$1 + 1;
  });
});
newPlayer.find('input').attr("value", function(i, value) {
  return value.replace(/(\d+)/, function($0, $1) {
    return +$1 + 1;
  });
});
newPlayer.appendTo(".players");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="players">
  <div class="row mb-2">
    <div class="col">
      <input name="players[2][nickname]" type="text" class="form-control" id="p_nickname" placeholder="Nickname" value="Player2">
    </div>
    <div class="col p_region" style="">
      <select name="players[2][region]" class="form-control">
        <option value="" disabled="" selected="">Choose region</option>
      </select>
    </div>
    <div class="col-2">
      <button type="button" class="w-100 btn-sm btn-danger deleteRow">Delete</button>
    </div>
  </div>
</div>
0
mplungjan 29 Oktober 2019, 15:16