Okay so here's the idea:
I want to make a jQuery script to handle multiple forms. Every form has a button. When you click this button the script should send all input fields' name and value in $_POST to the form's action URL. But I can't make it work.
It won't loop through my .each on line 3 in my jQuery file.
jQuery:
$("input[type='button']").click(function(){
var query = {};
$(this).parent('form').children('input[type="text"]').each(function(){
query[$(this).attr('name')] = $(this).val();
});
$.post($(this).parent('form').attr('action'), query, function(data) {
$("#dialog").html(data);
$("#ui-id-1").html('Activate account');
$("#dialog").dialog("open");
}, 'json');
});
HTML:
<form action="/action/activateacc.php">
<table>
<tr>
<td>E-mail:</td>
<td><input type="text" id="mail" name="mail" /></td>
<td><img class="tick" id="mailIMG" width="20px" /></td>
</tr>
<tr>
<td>Activation code:</td>
<td><input type="text" id="code" name="code" /></td>
<td><img class="tick" id="codeIMG" width="20px" /></td>
</tr>
<tr>
<td>Choose organization-name:</td>
<td><input type="text" id="name" name="name" /></td>
<td><img class="tick" id="nameIMG" width="20px" /></td>
</tr>
<tr>
<td></td>
<td style="text-align:center"><input type="button" style="cursor:pointer" value="Activate account" /></td>
</tr>
</table>
</form>
Just use .serialize() with the form to get name/values of your inputs- also you should be using closest since parent only goes up one level
$("input[type='button']").click(function(){
var query = $(this).closest('form').serialize();
$.post($(this).parent('form').attr('action'), query , function(data) {
$("#dialog").html(data);
$("#ui-id-1").html('Activate account');
$("#dialog").dialog("open");
}, 'json');
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With