Changing parent element value property
Changing parent element value property
I have html code like this:
<td value='3' style='text-align: center'>
<select class='selection' onchange=''>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>
</td>
What i want to do is change value of select parent - td to selected one on onchange event. How can i accomplish that?
select
td
onchange
PS as you can see that is td - so i have multiple rows and cannot assign id to td/select
td
id
PresaberiSve()
td
value
data-attributes
PresaberiSve() is not affecting code anyhow. I will edit code and delete it so it doesn't confuse you– Aleksa Ristic
Aug 31 at 10:05
PresaberiSve()
They issue is that you are trying to change the "value property" of something that doesn't have a "value property" - so what you are actually trying to do in your code will provide the answer. You have not (yet) provided that information. As to "how can I accomplish that" - the basic answer is: you can't - as it's not something that makes any sense. (so we need to see what you think that means, ie with your js code).
– freedomn-m
Aug 31 at 10:07
At a guess, you might want:
$(".selection").change(function() $(this).closest("td").attr("value", $(this).val()); );– freedomn-m
Aug 31 at 10:08
$(".selection").change(function() $(this).closest("td").attr("value", $(this).val()); );
@freedomn-m I do not understand.
td has value property of 3– Aleksa Ristic
Aug 31 at 10:08
td
value
3
2 Answers
2
do you want something like this ?
function PresaberiSve(obj)
$("td").removeClass("active");
$(obj).closest("td").addClass("active");
.active
background-color:yellow;
border: 10px solid yellow;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr>
<td value='3' style='text-align: center'>
<select class='selection' onchange='PresaberiSve(this);'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>
</td>
<td value='3' style='text-align: center'>
<select class='selection' onchange='PresaberiSve(this);'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>
</td>
<tr>
</table>
It is what i wanted but not inside that function. I will just create new one. Thank you.
– Aleksa Ristic
Aug 31 at 10:11
yup you can modify this and create code as per your need :)
– Dhaval Pankhaniya
Aug 31 at 10:12
@AleksaRistic check my answer here
– Misir Jafarov
Aug 31 at 10:20
It's very simple :)
<td value='3' style='text-align: center'>
<select class='selection' onchange='this.parentNode.setAttribute("value", this.value);'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>
</td>
or you can use script element to do this:
<td value='3' style='text-align: center'>
<select class='selection'>
<option value='1'>1</option>
<option value='2'>2</option>
<option value='3'>3</option>
</select>
</td>
<script>
document.querySelectorAll('.selection').forEach(function(e)
e.onchange = function() e.parentNode.setAttribute('value', e.value); );
);
</script>
Thanks for contributing an answer to Stack Overflow!
But avoid …
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
But avoid …
To learn more, see our tips on writing great answers.
Required, but never shown
Required, but never shown
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
please show us code of
PresaberiSve(). As well astddon't havevalueattribute. Usedata-attributesinstead– Alive to Die
Aug 31 at 10:04