Get value of text box using based on radio button selection jQuery

Question

I created a HTML table that has a radio button, delete button, and a text box in each row. When I select the apply button, I want to get the value of the text box in the same row as the checked radio button. Attached is my fiddle. Any help would be greatly appreciated :)

<input type="text" name="context" class="chooseContext"/>

This is the text that I am wanting to figure out how to alert based on which radio button is selected.

JSFiddle Code

Answer 1

You can set a number on id of input radio and input text, then you can check what of the radios of the same group is checked, then take the id of this radio and get the val of input text that has the same id. Wait i´m doing the jsfiddle... Regards!

EDIT: Here are users faster than me, Regards!

Answer 2

you can alert it like this:

$('#applyButton').on('click', function(){
    var alertTxt = $(':radio:checked').closest('tr').find('.chooseContext').val();
    alert(alertTxt);
});

Updated Fiddle

Answer 3

Not sure if it's the most elegant solution but you can do this

//Send selected default to add on
$(".contexts-list tr input[type='radio']:checked").each(function() {
    var val = $(this).parents("tr").find("input.chooseContext").val(); 
    alert("Default: " + val); 
}); 

Demo of it working

Answer 4

I solve this kind of things by using parents property in jQuery.

so usually when you click on something do a

$(this).parents('tr').find('input[type=text]').val();

So the hint here is to pick up the parent element row and then try finding the desired element in that row to take action.