How can I hide or show the input tag?
How can I hide the input tag or show that when I click on the span tag.
I want to click on each span tag and show input and hide the span tag associated with the line and other lines only showing the span tag. other lines like this line.
$(document).ready(function() {
var ID, tmp_ID, count, flag = 0;
$("tr").click(function() {
ID = $(this).attr('id');
$("#s" + ID).hide();
$("#num" + ID).show();
$("#btn" + ID).show();
});
$("btn" + ID).click(function() {
$("#s" + ID).show();
$("#num" + v).hide();
$("#btn" + ID).hide();
});
});
.num {
display: none;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table" id="tableCompleted">
<th>Name</th>
<tbody>
<tr id="1">
<td class="noEdit">
<span id="s1">1</span>
<div id="btn1" class="num">click me!</div>
<input type="number" id="num1" class="num" />
</td>
</tr>
<tr id="2">
<td>
<span id="s2">2</span>
<div id="btn2" class="num">click me!</div>
<input type="number" id="num2" class="num" />
</td>
</tr>
<tr id="3">
<td>
<span id="s3">3</span>
<div id="btn1" class="num">click me!</div>
<input type="number" id="num3" class="num" />
</td>
</tr>
<tr id="4">
<td>
<span id="s4">4</span>
<div>
<input id="btn4" class="num" type="submit" value="Release" />
</div>
<input type="number" id="num4" class="num" />
</td>
</tr>
</tbody>
</table>
Thanks for your reply.
source to share
Your question is really hard to understand, but what I am is that you want to hide and show the input in a row when you click it to row the range of an element?
Try to bind a click event to each range and get a parent to it and then inject it to toggle.
$('#tableCompleted span').each(function(){
$(this).click(function(){
$('#tableCompleted input').hide();
$(this).parent().find('input').first().show();
});
});
This code will hide all input fields in the table and display only the data that was called by the corresponding span tag.
If you want to hide the range in this line then use this code: http://jsfiddle.net/hy82ssy2/
source to share
Give each class a "btn" like "sub-btn" like this:
<div id = "btn1" class="num sub-btn">click me!</div>
then in your code do something like this:
$(".sub-btn").click(function()
{
ID = $(this).attr('id').replace(/\D/gi,'');//removes all non-numeric character in id to get number
$("#s" + ID).show();
$("#num" + ID).hide();
$("#btn" + ID).hide();
});
Note: You have 2 IDs with btn1 in your example
source to share