Считать данные с текущего бокса?

Question

[Артем Гартунг]

Имеется html структура:

<div class="add-box">
	<div class="subtitle">Заполните форму</div>
	<div class="form" data="post">
		<div class="form-item">
			<div class="form-wrapper">
				<label>Поле ввода 1</label>
				<input type="text" id="data_1" autocomplete="off">
			</div>
			<div class="form-wrapper">
				<label>Поле ввода 2</label>
				<input type="text" id="data_2" autocomplete="off">
			</div>
		</div>
		<div class="button yellow-btn" onclick="send('data_1')">Сохранить</div>
	</div>
</div>
<div class="add-box">
	<div class="subtitle">Заполните форму</div>
	<div class="form" data="post">
		<div class="form-item">
			<div class="form-wrapper">
				<label>Поле ввода 1</label>
				<input type="text" id="data_1" autocomplete="off">
			</div>
			<div class="form-wrapper">
				<label>Поле ввода 2</label>
				<input type="text" id="data_2" autocomplete="off">
			</div>
		</div>
		<div class="button yellow-btn" onclick="send('data_2')">Сохранить</div>
	</div>
</div>

и JS обработчик:

function send(name){
	$('div[data="post"] input').each(function(k, v){str += '&' + v.id + '=' + v.value;});
	$.ajax({
		url: '/url/' + name +'.php',
		type: 'POST',
		data: name + '_f'+ str,
		cache: false,
		success: function(data){
			var json = jQuery.parseJSON(data);
			if (json.url) {window.location.href = json.url} 
			else if (json.status == 'success'){$('#message').html('<p class="success">'+json.text+'</p>'); setTimeout(hide, 5000);} 
			else {$('#message').html('<p class="error">'+json.text+'</p>'); setTimeout(hide, 5000);}
		} 
	}); 
};

function hide() {$("#message > p").remove();}

Проблема заключается в том что когда нажимаешь

<div class="button yellow-btn" onclick="send('data_1')">Сохранить</div>

то данные считываются со второго блока, как сделать так что бы данные считывались с текущего <div class="form" data="post"></div> в котором находится кнопка отправки данных в JS обработчик?

Answer 1

[Danny Arty]

1) Зачем делать div-ами то, что должно быть формой?
2) Зачем вешать обработчик через инлайновый onclick? Вынесите нормально в js
3) Что вообще делает ваш код? Т.е. почему у первого подобия кнопки в send указан data_1, а у второго data_2?
4) Почему у вас одинаковые id у двух пар элементов? От этого страница конечно работать не перестанет, но вы нарушаете семантику, ведь id - это все таки уникальный идентификатор.