Multiple Checkbox with textbox enable/disable & array - laravel

Question

I have multiple checkbox field and when any checkbox checked then 3 input field appear. I want to insert data for 1 checkbox value with 3 input value.
Form:
<div class="form-check">
<input class="form-check-input fighting_style" name="txt_fightingStyle[]" type="checkbox" value="MMA" id="MMA">
<label class="form-check-label" for="flexCheckDefault">
MMA
</label>
<section class="fighiting_value" id="MMA_input" style="display: none;">
<div class="row">
<div class="col-3">
<div class="mb-3">
<label for="exampleFormControlInput1" class="form-label text-dark">WIN</label>
<input type="text" class="form-control fights txt_win"
name="txt_win[]" onblur="totalFights()" id="txt-win" placeholder="">
</div>
</div>
<div class="col-3">
<div class="mb-3">
<label for="exampleFormControlInput1" class="form-label text-dark">LOSS </label>
<input type="text" class="form-control fights txt_loss" data-points = "75"
name="txt_loss[]" onblur="totalFights()" id="txt-loss" placeholder="">
</div>
</div>
<div class="col-3">
<div class="mb-3">
<label for="exampleFormControlInput1" class="form-label text-dark">DRAW</label>
<input type="text" class="form-control fights txt_draw" data-points = "150"
name="txt_draw[]" onblur="totalFights()" id="txt-draw" placeholder="">
</div>
</div>
</div>
</section>
</div>
Javascript:
document.querySelectorAll("input[type=checkbox]").forEach(cb=>cb.addEventListener("click",ev=>{
let sibl=(cb.closest("label")??cb).nextElementSibling;
while(sibl&&!sibl.matches("section"))
sibl=sibl.nextElementSibling;
sibl.style.display=ev.target.checked?"":"none";
}));
document.querySelectorAll("input[type=text]").forEach(t=>t.addEventListener("blur",ev=>totalFights()));
This is my dd result
"txt_win" => array:12 [▼
0 => null
1 => null
2 => null
3 => "4"
4 => null
5 => "4"
6 => null
7 => null
8 => null
9 => null
10 => null
11 => null
]
"txt_loss" => array:12 [▼
0 => null
1 => null
2 => null
3 => "5"
4 => null
5 => "5"
6 => null
7 => null
8 => null
9 => null
10 => null
11 => null
]
"txt_draw" => array:12 [▼
0 => null
1 => null
2 => null
3 => "6"
4 => null
5 => "6"
6 => null
7 => null
8 => null
9 => null
10 => null
11 => null
]
my controller:
$dataWin = $request->txt_win;
$dataLoss = $request->txt_loss;
$dataDraw = $request->txt_draw;
foreach ($dataFightingStyle as $fightStyle) {
FighitData::create([
'fighting_style' => $fightStyle,
'winning_game' =>$dataWin,
'lost_game' => $dataLoss,
'draw_game' => $dataDraw,
]);
}
I just want to which checkbox box checked only when the check box is selected only the data of its text field can be taken and the rest will be disabled. Is there any way to do this.

Answer 1

I i understood your problem correctly, you need to get text fields related to checkboxes. In this case you could try something like that :
$dataWin = $request->txt_win;
$dataLoss = $request->txt_loss;
$dataDraw = $request->txt_draw;
foreach ($dataFightingStyle as $key => $fightStyle) {
FighitData::create([
'winning_game' =>$dataWin[$key],
'lost_game' => $dataLoss[$key],
'draw_game' => $dataDraw[$key],
]);
}