<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>How to become an editable HTML table with jQuery - MrBool Tutorial</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script>
$(function(){
$('input').addClass('data_values');
$('input').change(function(){
$(this).attr('data-ts-speed',$(this).val());
});
$('.save').click(function(){
$('.data_values').each(function(){
val1 = $(this).val();
val2 = $(this).attr('data-ts-speed');
if(val1 == val2 && val1 != 0){
//write you code;
alert(val1+'-'+val2);
}
});
return false;
});
});
</script>
</head>
<body>
<table class="editableTable">
<thead>
<tr>
<th>Vendor1</th>
<th>Vendor2</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" data-ts-speed="0" value="0"></td>
<td><input type="text" data-ts-speed="0" value="0"></td>
</tr>
<tr>
<td><input type="text" data-ts-speed="0" value="0"></td>
<td><input type="text" data-ts-speed="0" value="0"></td>
</tr>
<tr><td><input type="submit" value="submit" class="save"></td></tr>
</tbody>
</table>
</body>
</html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>How to become an editable HTML table with jQuery - MrBool Tutorial</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script>
$(function(){
$('input').addClass('data_values');
$('input').change(function(){
$(this).attr('data-ts-speed',$(this).val());
});
$('.save').click(function(){
$('.data_values').each(function(){
val1 = $(this).val();
val2 = $(this).attr('data-ts-speed');
if(val1 == val2 && val1 != 0){
//write you code;
alert(val1+'-'+val2);
}
});
return false;
});
});
</script>
</head>
<body>
<table class="editableTable">
<thead>
<tr>
<th>Vendor1</th>
<th>Vendor2</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" data-ts-speed="0" value="0"></td>
<td><input type="text" data-ts-speed="0" value="0"></td>
</tr>
<tr>
<td><input type="text" data-ts-speed="0" value="0"></td>
<td><input type="text" data-ts-speed="0" value="0"></td>
</tr>
<tr><td><input type="submit" value="submit" class="save"></td></tr>
</tbody>
</table>
</body>
</html>
No comments:
Post a Comment