S.Oruc S.Oruc - 2 months ago 9
CSS Question

Change value of one element with given class using jQuery

I have a form that gets data from a database.
I added a ui-icon.
Now I'm trying to change the value of a hidden input by clicking on the icon.
The problem is, if I click on it, it will change all the same inputs to false.
Changing to false is what it should do, but how can I make sure that it only changes the hidden input associated with the icon that I click ?

$("#kruisje").click(function(){
$(".statuss").val(false)
})


The element with id
kruisje
is the icon, and element with the class
statuss
is the hidden input.

Answer

You can achive it by $(this).parent().find('.statuss') for perticular clicked button.

$(".ui-icon.ui-icon-closethick").click(function(){
    $(this).parent().find('.statuss').val("");
});
@import "http://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css";
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class="row">
<span id="kruisje" class="ui-icon ui-icon-closethick" ></span>

<input class="statuss" type="hidden" value="i whant this to change to false">
<div><input name="test"></div>
<div><input name="test"></div>
<div><input name="test"></div>
<div>
    <select name="Links""style='display:none;'">
        <option  value="yea">asdasd</option>
        <option  value="fasdf">asdasd</option>
        <option  value="fdsf">asd</option>
    </select>
</div>
</div>
<div class="row">
<span id="kruisje" class="ui-icon ui-icon-closethick" ></span>

<input class="statuss" type="hidden" value="i whant this to change to false">
<div><input name="test"></div>
<div><input name="test"></div>
<div><input name="test"></div>
<div>
    <select name="Links""style='display:none;'">
        <option  value="yea">asdasd</option>
        <option  value="fasdf">asdasd</option>
        <option  value="fdsf">asd</option>
    </select>
</div>
</div>
<div class="row">
<span id="kruisje" class="ui-icon ui-icon-closethick" ></span>

<input class="statuss" type="hidden" value="i whant this to change to false">
<div><input name="test"></div>
<div><input name="test"></div>
<div><input name="test"></div>
<div>
    <select name="Links""style='display:none;'">
        <option  value="yea">asdasd</option>
        <option  value="fasdf">asdasd</option>
        <option  value="fdsf">asd</option>
    </select>
</div>
</div>

Comments