Я динамически создаю формы из объекта JSON, который я получаю с помощью getJSON. Если есть лучший способ создания форм таким образом, пожалуйста, дайте мне знать. Я использовал этот пример, чтобы понять, как перестроить кнопку отправки: Rebind dymanically created forms after jQuery ajax response **Как получить attritubes ввода формы при генерации формы динамически и с использованием .live()
Что мне нужно знать, так это как захватить класс кнопки ввода ввода, которую я нажал. Там есть кнопка «Утвердить» и «Отклонить», и в зависимости от того, какой щелчок будет отправлен на сервер в POST, я знаю, что делать с данными формы, которые POST'ed на стороне сервера.
Вот код:
<script type="text/javascript">
$().ready(function(){
jQuery("form[id^='message-']").live('submit', function(){
var id = parseInt(this.id.replace("message-", ""));
// this is not the value of the class attribute from submit button clicked.
var action = this.attr('class');
alert(action);
return false;
jQuery.ajax({
type: "POST",
url: "/path/to/ajaxhandler.php",
data: {"action": action, "id": id},
success: function(response) {
}
});
/*
generate form
*/
$.fn.getAllUnapprovedMessages = function() {
$.getJSON("/messages.php?a=getAllUnapproved, function(data){
var i=0;
$("div#messages").empty();
while(i<data.length) {
$('div#messages').append(
'<div id="msg-'+data[i].id+'" style="border: 1px coral solid; margin: 5px 5px 5px 5px;">'+
'<form id="message-'+data[i].id+'" name="form-'+data[i].id+'" action="/path/to/ajaxhandler.php" >'+
'From: '+data[i].u_from+' ----> To: '+data[i].u_to+'<br />'+
'Subject: <br /><input name="subject" type="text" value="'+data[i].subject+'" /> <br /><br />'+
'Message: <br /><textarea rows="10" cols="60">'+data[i].text+'</textarea><br />'+
'<input class="formApprove" type="submit" id="approve-'+data[i].id+'" value="Approve" /> or '+
'<input class="formDeny" type="submit" id="deny-'+data[i].id+'" value="Deny" />'+
'</form></div>');
i++;
}
});
}
}
</script>
Вот что мне нужно изменить, чтобы быть правильным:
// this is not the value of the class attribute from submit button clicked.
var action = this.attr('class');
alert(action);
Так что я могу получить атрибут класса с помощью кнопки, которая была нажата.
UPDATE (8.27.2010) - Вот что я сделал для тех, кто спотыкается через это и требует ответа:
Для функции serializeObject(), увидеть этот пост: Convert form data to JavaScript object with jQuery
$(".formApprove").live('click', function() {
var fid = this.id.replace(/approve-/i, "");
var formObject = $('form#message-'+fid).serializeObject();
$.post('/path/to/ajaxhandler.php', {
a: 'setApproved',
id: fid,
subject: formObject.subject,
message: formObject.message
}, function(res) {
if(res.result == 0) {
alert ('done');
} else {
alert ('Error');
},"json");
return false;
});
Трудно понять, что происходит без написания разметки, но я был бы осторожен в привязке событий нажатия к кнопкам отправки - помните, что формы по умолчанию могут быть отправлены, когда пользователь нажимает клавишу Enter. – RussellUresti
@ RussellUresti Хорошая мысль, любые предложения? – kom
Как сделать что-то вроде: $ ('input'). Live ('keypress', function (e) {if (e.keyCode == 13) {return false;}}); – kom