|
Сообщение от nastya97core
|
|
Нужно, чтобы при сохранении создавался массив только изменённых
|
Как вариант...
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="https://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<style>
table {
border-collapse: collapse;
}
td {
border: 1px solid grey;
min-width: 10vw;
padding: 10px;
}
input {
border:none;
border-bottom:1px solid black;
}
</style>
<script>
$(function() {
$('input, select').on('change', function() {
const o = $(this)
o.addClass('on')
o.parents().parent().addClass('on')
})
$('#test').on('submit', function() {
let a = []
$('#data > tbody > tr.on').each(function() {
let obj = {}
const o = $(this)
const id = o.find('td:first-child').text()
obj.id = id
o.find('.on').each(function() {
obj[this.name] = this.value
})
a.push(obj)
})
alert(JSON.stringify(a))
return false
})
})
</script>
</head>
<body>
<form id='test'>
<table id='data'>
<thead>
<tr>
<td>id</td>
<td>Стоимость</td>
<td>Инфо</td>
<td>Статус</td>
</tr>
</thead>
<tbody>
<tr>
<td>a1</td>
<td><input type="text" name='sum' value="123"></td>
<td><input type="text" name='info' value="перезвонить"></td>
<td><select name='status'>
<option value="value1" selected>В обработке</option>
<option value="value2">Завершен</option>
<option value="value3">Невозможен</option>
</select></td>
</tr>
<tr>
<td>a2</td>
<td><input type="text" name='sum' value="1413"></td>
<td><input type="text" name='info'></td>
<td><select name='status'>
<option value="value1">В обработке</option>
<option value="value2" selected>Завершен</option>
<option value="value3">Невозможен</option>
</select></td>
</tr>
<tr>
<td>a3</td>
<td><input type="text" name='sum' value="222"></td>
<td><input type="text" name='info'></td>
<td><select name='status'>
<option value="value1" selected>В обработке</option>
<option value="value2">Завершен</option>
<option value="value3">Невозможен</option>
</select></td>
</tr>
</tbody>
</table>
<button>Сохранить</button>
</form>
</body>
</html>