Cross Vander
Cross Vander

Reputation: 2157

Javascript Radio add value Textarea

Is there any ways to set a textarea when I clicked a radio button at some row (<tr>) ?

function changeTeks(i){
  var teks = '';
  var row = $(this).parents('tr');
  if(i == '1'){
    teks = row.find('input[name="brazil[]"]').val();
  }else if(i == '2'){
    teks = row.find('input[name="normal[]"]').val();
  }else if(i == '3'){
    teks = row.find('input[name="gagal[]"]').val();
  }else{
    teks = "belum";
  }
  row.find('textarea[name="hasil[]"]').text(teks);
  console.log(teks);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1">
<tr>
<td>1</td>
<input type='hidden' name='gagal[]' value='fail in test 1' />
<input type='hidden' name='normal[]' value='not yet in test 1 ' />
<input type='hidden' name='brazil[]' value='success in test 1' />
<td><input type='hidden' name='lingkup[]' value='30' />Test 1</td>
<td><input type='radio' name='target0[]' value='1' onclick='changeTeks(1)' />
</td>
<td><input type='radio' name='target0[]' value='2' onclick='changeTeks(2)' />
</td>
<td><input type='radio' name='target0[]' value='3' onclick='changeTeks(3)' />
</td>
<td><textarea name='hasil[]' class='form-control'></textarea></td>
</tr>
<tr>
<td>1</td>
<input type='hidden' name='gagal[]' value='fail in test 2' />
<input type='hidden' name='normal[]' value='not yet in test 2' />
<input type='hidden' name='brazil[]' value='success in test 2' />
<td><input type='hidden' name='lingkup[]' value='30' />Test 2</td>
<td><input type='radio' name='target1[]' value='1' onclick='changeTeks(1)' />
</td>
<td><input type='radio' name='target1[]' value='2' onclick='changeTeks(2)' />
</td>
<td><input type='radio' name='target1[]' value='3' onclick='changeTeks(3)' />
</td>
<td><textarea name='hasil[]' class='form-control'></textarea></td>
</tr>
<tr>
<td>1</td>
<input type='hidden' name='gagal[]' value='fail in test 3' />
<input type='hidden' name='normal[]' value='not yet in test 3' />
<input type='hidden' name='brazil[]' value='success in test 3' />
<td><input type='hidden' name='lingkup[]' value='30' />Test 3</td>
<td><input type='radio' name='target2[]' value='1' onclick='changeTeks(1)' />
</td>
<td><input type='radio' name='target2[]' value='2' onclick='changeTeks(2)' />
</td>
<td><input type='radio' name='target2[]' value='3' onclick='changeTeks(3)' />
</td>
<td><textarea name='hasil[]' class='form-control'></textarea></td>
</tr>
                                </table>

I always get undefined value from the parent. I want to fill textarea with text in input type hidden value for each row (because this hidden value is different for each row)

Upvotes: 1

Views: 62

Answers (1)

Suchit kumar
Suchit kumar

Reputation: 11859

From the Pranav's comment pass this in your function and the use it inside.

function changeTeks(ele,i){
	  var teks = '';
	  var row = $(ele).closest('tr');
	  if(i == '1'){
	    teks = row.find('input[name="brazil[]"]').val();
	  }else if(i == '2'){
	    teks = row.find('input[name="normal[]"]').val();
	  }else if(i == '3'){
	    teks = row.find('input[name="gagal[]"]').val();
	  }else{
	    teks = "belum";
	  }
	  row.find('textarea[name="hasil[]"]').html(teks);
	  console.log(teks);
	}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1">
<tr>
<td>1</td>
<input type='hidden' name='gagal[]' value='fail in test 1' />
<input type='hidden' name='normal[]' value='not yet in test 1 ' />
<input type='hidden' name='brazil[]' value='success in test 1' />
<td><input type='hidden' name='lingkup[]' value='30' />Test 1</td>
<td><input type='radio' name='target0[]' value='1' onclick='changeTeks(this,1)' />
</td>
<td><input type='radio' name='target0[]' value='2' onclick='changeTeks(this,2)' />
</td>
<td><input type='radio' name='target0[]' value='3' onclick='changeTeks(this,3)' />
</td>
<td><textarea name='hasil[]' class='form-control'></textarea></td>
</tr>
<tr>
<td>1</td>
<input type='hidden' name='gagal[]' value='fail in test 2' />
<input type='hidden' name='normal[]' value='not yet in test 2' />
<input type='hidden' name='brazil[]' value='success in test 2' />
<td><input type='hidden' name='lingkup[]' value='30' />Test 2</td>
<td><input type='radio' name='target1[]' value='1' onclick='changeTeks(this,1)' />
</td>
<td><input type='radio' name='target1[]' value='2' onclick='changeTeks(this,2)' />
</td>
<td><input type='radio' name='target1[]' value='3' onclick='changeTeks(this,3)' />
</td>
<td><textarea name='hasil[]' class='form-control'></textarea></td>
</tr>
<tr>
<td>1</td>
<input type='hidden' name='gagal[]' value='fail in test 3' />
<input type='hidden' name='normal[]' value='not yet in test 3' />
<input type='hidden' name='brazil[]' value='success in test 3' />
<td><input type='hidden' name='lingkup[]' value='30' />Test 3</td>
<td><input type='radio' name='target2[]' value='1' onclick='changeTeks(this,1)' />
</td>
<td><input type='radio' name='target2[]' value='2' onclick='changeTeks(this,2)' />
</td>
<td><input type='radio' name='target2[]' value='3' onclick='changeTeks(this,3)' />
</td>
<td><textarea name='hasil[]' class='form-control'></textarea></td>
</tr>
                                </table>

Upvotes: 2

Related Questions