I'm trying to submit a form with jquery from plugin With multiple submits, but i can't get the value from the $_POST['aggInf'] in php, i can get it in js.
My form:
<form action="#" method="post" id="gestioneProfilo">
My inputs:
<input name="aggInf" type="submit" value="Upload" class="upload">
<input name="aggInfAnn" type="submit" value="Annulla" id="cancel">
If i try onsubmit='alert($(this).serialize()); return false;' on the from i always get this in return:
On the js side i used this solution and it works fine, if i try a console.log() command i get the correct value.
If i try a var_dump() command i only get all the other input and textboxes values. How do i fix this?
Full form html:
<form action="#" method="post" id="gestioneProfilo">
<!-- Scelta avatar -->
<div id="sceltaAvatar">
<!-- Profilo -->
<div id="perAvatar">
<h1>Scelta dell'Avatar</h1>
<p>Carica dal tuo pc o dal web una tua immagine di profilo</p>
<!-- <input type="hidden" name="immP"> -->
</div>
<!-- Copertina -->
<div id="perCopertina">
<h1>Scelta della copertina</h1>
<p>Carica dal tuo pc o dal web una tua immagine di copertina</p>
<!-- <input type="hidden" name="immC"> -->
</div>
<!-- Info generali -->
<div id="altreInfo">
<div>
<!-- informazioni -->
<h1>Informazioni</h1>
<textarea placeholder="Cosa fai nella vita? Scrivi una breve descrizione su di te" name="bio" id="bio"><?php get_stuff('bio', TRUE, TRUE) ?></textarea>
</div>
<div id="due">
<div>
<!-- Sito -->
<h1>Sito</h1>
<textarea placeholder="Il tuo sito" name="sito" id="sito"><?php get_stuff('sito', TRUE, TRUE) ?></textarea>
</div>
<div>
<!-- Posizione -->
<h1>Posizione</h1>
<textarea placeholder="Da dove vieni?" name="pos" id="pos"><?php get_stuff('pos', TRUE, TRUE) ?></textarea>
</div>
</div>
</div>
<!-- Torna indietro -->
<input name="aggInf" type="submit" value="Upload" class="upload">
<input name="aggInfAnn" type="submit" value="Annulla" id="cancel">
</div>
</form>
<?php include_once 'lightbox.php' ?>
js:
$('#gestioneProfilo').submit(function(e) {
e.preventDefault();
var
val = $("input[type=submit][clicked=true]").val(),
pop = $(this);
console.log(val);
// it works, if i press upload it prints upload, if i press annulla it prints annulla
if (val == "Upload") {
$(this).ajaxSubmit({
type: 'POST',
url: "lib/ajax.php",
dataType: "json",
data: pop.serialize(),
success: function(data){
//stuff
}
});
}else{
cambiaA("#perCommentare", "#gestioneProfilo", "ritorna");
};
});
$(document).on('click', '#gestioneProfilo input[type=submit]', function() {
$("input[type=submit]",
$(this).parents("#gestioneProfilo")).removeAttr("clicked");
$(this).attr("clicked", "true");
});
php:
if (isset($_POST['aggInf'])) {
update_info();
$return_data['immP'] = get_stuff('immP');
$return_data['immC'] = get_stuff('immC');
$return_data['bio'] = get_stuff('bio');
$return_data['sito'] = get_stuff('sito', FALSE, TRUE);
$return_data['pos'] = get_stuff('pos');
echo json_encode($return_data);
exit;
}
Related
good afternoon
I have a problem, I am trying to save the data values from the form in the database.
AJAX is used to send the data using the POST method but when evaluating the outputs from the .done and .fail functions, they return no information.
This is the html
<div class="form">
<h1>Ingreso Alumno-Trabajo</h1>
<form name="formulario_contacto" id="formdata">
<p>
<label for="cest">cedula estudiante</label>
<input type="number" id="cest" name="cest" autofocus required>
</p>
<p>
<label for="nest">nombre estudiante</label>
<input type="text" id="nest" name="nest" required>
</p>
<p>
<label for="aest">Apellido estudiante</label>
<input type="text" id="aest" name="aest" required>
</p>
<p class="full-width">
<label for="tit">Titulo</label>
<textarea name="" id="tit" cols="30" rows="3" name="tit" required></textarea>
</p>
<p>
<label for="nase">nombre asesor</label>
<input type="text" id="nase" name="nase" required>
</p>
<p>
<label for="fsede">Sede :</label>
<select id="fSede" name="fSede">
<option value="Montalban">Montalban</option>
<option value="Guyana">Guayana</option>
<option value="Virtual">Virtual</option>
</select>
</p>
<p class="full-width button">
<input type="submit" value="Ingresar">
<input type="reset" value="Restaurar">
</p>
</form>
</div>
<div id="mensaje">
<h3></h3>
</div>
This is the JS using AJAX
<pre>
$(document).ready(function () {
// This part of the code will automatically execute when doc is ready.
$("#mensaje").html("");
$("input:submit").click(function () {
// We set the default action to be made once we submit.
// Let's validate the form first
if (validaForm()) {
var formulario = $("#formdata").serializeArray();
$.ajax({
// url: "php/enviar.php",
// type: "POST",
type: "POST",
url: "php/enviar.php",
dataType: "json",
data: formulario,
})
//do something when get response })
.done(function (respuesta) {
//do something when any erro
$("#mensaje").html(respuesta.mensaje);
alert("coño de la madre");
})
.fail(function (respuesta) {
//do something when any erro
alert("coño de la madre falla" + respuesta);
});
} else {
// We show this when the validation fails
$("#mensaje").html("falta Ingresar la data");
}
});
$("input:reset").click(function () {
$("#mensaje").html("");
});
});
</pre>
This is the PHP
<?php
echo "Estoy entrando aqui"; #I'm entering here
if(isset($_POST["cest"]))
{
$cedula = $_POST["cest"];
$nombre = $_POST["nest"];
$apellido = $_POST["aest"];
$titulo = $_POST["tit"];
$nomase = $_POST["nase"];
$sede = $_POST["fsede"];
$inserta = "INSERT INTO tbl-est-teg (cedula,nombre, apellido, titulo, nomase, sede) VALUES ('$cedula','$nombre','$apellido','$titulo','$nomase','$sede')";
$conexion = new mysqli("localhost","yguer2","s&4gBz6nPrA8*S7","estudiante-trabajo",3306);
$respuesta = new stdClass();
if($conexion->query($inserta)){
$respuesta->mensaje = "Se guardo correctamente";
}
else {
$respuesta->mensaje = "Ocurrió un error";
}
echo json_encode($respuesta);
}
?>
<script>
$(document).ready(function () {
// This part of the code will automatically execute when doc is ready.
$("#mensaje").html("");
$("#formdata").on("submit",function () {
// We set the default action to be made once we submit.
// Let's validate the form first
if (validaForm()) {
var formulario = $("#formdata").serializeArray();
$.ajax({
// url: "php/enviar.php",
// type: "POST",
type: "POST",
url: "php/enviar.php",
dataType: "json",
data: formulario,
}).done(function (respuesta) {
//do something when any erro
$("#mensaje").html(respuesta.mensaje);
alert("coño de la madre");
}).fail(function (respuesta) {
//do something when any erro
alert("coño de la madre falla" + respuesta);
});
} else {
// We show this when the validation fails
$("#mensaje").html("falta Ingresar la data");
}
});
$("input:reset").click(function () {
$("#mensaje").html("");
});
});
</script>
You could try by just doing that but as some people have told you in the comments, there are some serious vulnerability issues in your PHP file, but I guess you should solve this first,
Use the console, if you're using chrome you could just press F12,
There are several things to be asked, I'm guessing your validaForm() function is working well
If you have more questions please edit the original questions so we can help.
Post this in the Spanish version of this site and I could help you there too, just let me know.
Publica esto en el sitio en Español y te puedo ayudar allí, solo deja un comentario con el link a la pregunta.
I have a form made with ajax, in this form there are 2 submits, both have the same function as sending an email but depending on whether the user uses one or the other the email must indicate this selection.
I tried to use the isset function to see which of the two buttons to submit but when I receive this parameter it is empty.
HTML form
<form id="form-landing" data-ajax="<?php echo admin_url('admin-ajax.php?action=contactlanding'); ?>">
<?php while (have_posts()) : the_post();
the_content();
endwhile; ?>
<?php wp_nonce_field(); ?>
<div id="step1">
<div class="group-form">
<p>1.- question 1</p>
<div>
<label for="afrontarsi">Yes</label><input type="radio" name="afrontar" value="Si" id="afrontarsi">
<label for="afrontarno">No</label><input type="radio" name="afrontar" value="No" id="afrontarno">
</div>
</div>
<div class="group-form">
<p>2. - Question 2</p>
<div>
<input type="text" name="importe" id="importe"> €
</div>
</div>
<button class="send-button" name="1button" href="">Yes</button>
<button class="send-button" name="2button" href="">No</button>
</form>
jQuery
if(is_page_template('template-landing.php')): ?>
$('#form-landing').submit(function(e){
e.preventDefault();
var form = $(this).addClass('loading');
var alert = form.find('.alert').removeClass('alert-danger alert-success').html('');
$.ajax({
url:form.data('ajax'),
type:'POST',
data:new FormData(this),
processData:false,
contentType:false,
}).done(function(data){
form[0].reset();
form.find('.btn').prop('disabled',true);
alert.addClass('alert-success').html(data);
}).fail(function(error){
alert.addClass('alert-danger').html(error.responseText);
}).always(function(){
form.removeClass('loading');
});
});
<?php endif;
?>
PHP function
function contactlanding(){
if(check_ajax_referer()){
$afrontar = sanitize_text_field($_POST['afrontar']);
$importe = sanitize_text_field($_POST['importe']);
if (isset($_POST['1button'])) {$button="First";} else{$button="Second";}
$web = parse_url(home_url(),PHP_URL_HOST);
$message = '<p><strong>Afrontar:</strong> '.$afrontar.'</p>';
$message .= '<p><strong>Importe:</strong> '.$importe.'</p>';
$message .= '<p><strong>Button:</strong> '.$button.'</p>';
$headers = 'MIME-Version:1.0'."\r\n";
$headers .= 'Content-type:text/html;charset=utf-8'."\r\n";
$headers .= 'From:noreplay#'.$web."\r\n";
$headers .= 'Reply-To:'.$email."\r\n";
$send = mail(get_bloginfo('admin_email'),'Mensaje enviado desde '.$web,$message,$headers);
if($send==true){
echo 'Gracias, tu mensaje se ha enviado correctamente.';exit;
}
}
http_response_code(400);echo 'Algo salió mal, por favor intenta más tarde.';exit;
}
You can store the action in an hidden input.
Your server will receive the data, and you will be able to read it. Next, a very simple approach to show you the way :
$('.send-button').on('click', function (){ $(this).closest('form').find('[name="action"]').val($(this).data('submit'))
})
$('form').on('submit', function(evt) {
// form content :
console.log($(this).serialize());
// prevent form submission for the demo
evt.preventDefault();
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
<input type="text" name="firstname" value="Johon" />
<input type="hidden" name="action" value="" />
<button class="send-button" name="1button" href="" data-submit="yes">Yes</button>
<button class="send-button" name="2button" href="" data-submit="no">No</button>
</form>
I have this script that allows me to send data to the database without reloading the page. The form data is sent to file process.php.
At the end of the process, inside the div box of the form is printed a notice that everything went ok
<script type="text/javascript">
$(document).ready(function(){
$(document).on('submit', '.formValidation', function(){
var data = $(this).serialize();
$.ajax({
type : 'POST',
url : 'submit.php',
data : data,
success : function(data){
$(".formValidation").fadeOut(500).hide(function(){
$(".result").fadeIn(500).show(function(){
$(".result").html(data);
});
});
}
});
return false;
});
});
</script>
Page success.php:
foreach( $_POST as $key => $value ) {
$sql = "INSERT INTO tbl_".$key."(nome_".$key.") VALUES ('$value')";
$result = dbQuery($sql);
}
print "ok";
And the div box for the notice <div class="result"></div>
The problem: I have many div box with a form and when I print the notice of success, it happen into all the <div>, because the call notification is always .result
success: function(data){
$(".formValidation").fadeOut(500).hide(function(){
$(".result").fadeIn(500).show(function(){
$(".result").html(data);
});
});
}
What I want: Print the success notice in its own div depending on the form that I sent.
Thanks
EDIT: The html interested
<form id="myform2" class="formValidation" name="myform2" action="" method="post"></form> <!-- this is the form for the <div> in html5 -->
<div class="widget-body">
<div class="widget-main">
<div>
<label for="form-field-select-1">Comune</label>
<select name="comune" class="form-control" id="form-field-select-1" form="myform2">
<option value="">Seleziona...</option>
<?php
$comune = "SELECT * FROM tbl_comune ORDER BY nome_comune ASC";
$result_comune = dbQuery($comune);
if (dbNumRows($result_comune) > 0) {
while($row_comune = dbFetchAssoc($result_comune)) {
extract($row_comune);
?>
<option value="<?php echo $id_comune; ?>"><?php echo $nome_comune; ?></option>
<?php
}
} else {
?>
<option value="">Non ci sono dati</option>
<?php
}
?>
</select>
</div>
<hr>
<div class="widget-body">
<div class="widget-main">
<div>
<input type="text" name="comune" id="comune" value="" placeholder="Aggiungi Comune" form="myform2">
<input type="submit" name="submit" value="Submit" class="btn btn-sm btn-success" form="myform2">
<div class="result"></div>
</div>
</div>
</div>
</div>
</div>
If the form is in a div and the result is next to the form, you can do sibling:
$form.next(".result").html(data);
or elsewhere in the same parent:
$form.parent().find(".result").html(data);
or in your case
$form.find(".result").html(data);
Like this - note I have removed all the unnecessary hiding.
$(function() {
$(document).on('submit', '.formValidation', function(e) {
e.preventDefault();
var data = $(this).serialize();
$form = $(this); // save a pointer to THIS form
$result = $form.find(".result");
$.ajax({
type: 'POST',
url: 'submit.php',
data: data,
success: function(data) {
$result.html(data);
$form.fadeOut(500, function() {
$result.fadeIn(500)
});
}
});
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form id="myform2" class="formValidation" name="myform2" action="" method="post"></form>
<!-- this is the form for the <div> in html5 -->
<div class="widget-body">
<div class="widget-main">
<div>
<label for="form-field-select-1">Comune</label>
<select name="comune" class="form-control" id="form-field-select-1" form="myform2">
<option value="">Seleziona...</option>
</select>
</div>
<hr>
<div class="widget-body">
<div class="widget-main">
<div>
<input type="text" name="comune" id="comune" value="" placeholder="Aggiungi Comune" form="myform2">
<input type="submit" name="submit" value="Submit" class="btn btn-sm btn-success" form="myform2">
<div class="result"></div>
</div>
</div>
</div>
</div>
</div>
I'm new to jQuery and I'm trying to use it to validate a login form. However, the validation script doesn't activate: it just sits there doing nothing, while disabling the submit button. I think it is interfering with another script running on the same form, which lets the user switch between different forms in the same div.
Here's the html:
<div class="box">
<?php if (isset($_SESSION['login'])){ ?>
<h2>Welcome back, <?php echo $_SESSION['username']; ?></h2>
<div><p>Click here to log outt</p></div>
<?php } else { ?>
<div id="form_wrapper" class="form_wrapper">
<div class="register"> <!-- First form -->
<form id="registrationform">
<h2>Register</h2>
<div class="box">
<div>
<label>Name:</label>
<input name="nomeagenzia" type="text" required />
</div>
<!-- Some other input fields -->
<input type="submit" value="Register" />
Already a user? Login here
</div>
</form>
</div>
<div class="login active"> <!-- Second form, the one I'm validating-->
<form id="loginform" action="index.php" method="POST">
<h2>Area Agenzie</h2>
<div class="box">
<div>
<label>Username:</label>
<input name="username" type="text" />
</div>
<div style="position:relative;">
<label>Password:</label>
Forgot your password?
<input name="password" type="password" />
</div>
<input name="submit" type="submit" value="Login" />
Register here!
</div>
</form>
</div>
<!-- There's a third form I omitted -->
</div>
<?php } ?>
</div>
Here is the javascript to switch between the forms:
$(function() {
var $form_wrapper = $('#form_wrapper'),
$currentForm = $form_wrapper.children('div.active'),
$linkform = $form_wrapper.find('.linkform');
$form_wrapper.children('div').each(function(i){
var $theForm = $(this);
if(!$theForm.hasClass('active'))
$theForm.hide();
$theForm.data({
width : $theForm.width(),
height : $theForm.height()
});
});
setWrapperWidth();
$linkform.bind('click',function(e){
var $link = $(this);
var target = $link.attr('rel');
$currentForm.fadeOut(100,function(){
$currentForm.removeClass('active');
$currentForm= $form_wrapper.children('div.'+target);
$form_wrapper.stop()
.animate({
width : $currentForm.data('width') + 'px',
height : $currentForm.data('height') + 'px'
},225,function(){
$currentForm.addClass('active');
$currentForm.fadeIn(100);
});
});
e.preventDefault();
});
function setWrapperWidth(){
$form_wrapper.css({
width : $currentForm.data('width') + 'px',
height : $currentForm.data('height') + 'px'
});
}
});
Here's the validation script:
$(document).ready(function()
{
$("#loginform").validate(
{
rules:{
'username':{
required: true,
remote:{
url: "php/validatorAJAX.php",
type: "post"
}
},
'password':{
required: true
}
},
messages:{
'username':{
required: "Il campo username è obbligatorio!",
remote: "L'username non esiste!"
},
'password':{
required: "Il campo password è obbligatorio!"
}
},
submitHandler: function(form){
if($(form).valid())
form.submit();
return false;
}
});
});
Finally, this is validatorAJAX.php included in the validation script:
<?php
$mysqli = new mysqlc();
function usernameExists($username){
$username = trim($username);
$stmt = $mysqli->prepare("SELECT COUNT(*) AS num FROM utenti WHERE username= ?");
$stmt->bind_param("s", $username);
$stmt->execute();
$stmt->bind_result($result);
$result = (bool)$stmt->fetch();
$stmt->close();
return $result;
}
if(isset($_POST['username'])){
if(usernameExists($_POST['username'])){
echo 'true';
}else{
echo 'false';
}
}
?>
You can test out the script at http://pansepol.com/NEW, and you'll see that nothing happens when you click "Submit" on the login_form. Moreover, no validation is done whatsoever. I'm going nuts here :)
I fixed it: there was a problem with the validatorAJAX.php, which causes the whole form to crash. Basically the mysqli object was initialized outside the function, and this caused the validation to fail.
I am using jquery serialize and Ajax to capture form values and process them with Ajax using json as data Type, but no values are being returned. I have tried various ways to try and see why this is happening, but to no avail. There is no errors being returned in firebug or chrome. I would be grateful if someone could check my code and point out my error. Thanks
html code
<!--- Form to add box -->
<div id="boxaddform" style="display:none;">
<div class="dialogTop_padd"></div>
<form id="BA_boxform" name="BA_boxform" method="post">
<fieldset>
<legend><span></span>Select Company</legend>
<div class="spacer"></div>
<div class="formMessage">Click again to open</div>
<div class="fld_fld">
<div>
<label for="BA_customer">Company:</label><br />
<select name="BA_customer" id="BA_customer">
<option SELECTED VALUE="">Select a Company</option>
<?php
do {
?>
<option value="<?php echo $row_Recordsetcust['customer']?>"><?php echo $row_Recordsetcust['customer']?></option>
<?php
}
while ($row_Recordsetcust = mysql_fetch_assoc($Recordsetcust));
$rows = mysql_num_rows($Recordsetcust);
if($rows > 0)
{
mysql_data_seek($Recordsetcust, 0);
$row_Recordsetcust = mysql_fetch_assoc($Recordsetcust);
}
?>
</select>
<div class="spacer"></div>
<!--- displays the address and dept from the change function -->
<div id="BA_dept"></div>
<br />
<div id="BA_address"></div>
</div>
</fieldset>
<div class="dialogTop_padd"></div>
<!--- fieldset for service level -->
<fieldset>
<legend>Service Level</legend>
<div class="spacer"></div>
<div>
<label for="BA_service">Service level:</label>
<select name="BA_service" id="BA_service">
<option SELECTED VALUE="">Select an option</option>
<option value="Standard">Standard</option>
<option value="Rapid">Rapid</option>
</select><br />
</div>
</fieldset>
<div class="dialogTop_padd"></div>
<!--- fieldset for box # -->
<fieldset>
<legend>Box Details</legend>
<div class="spacer"></div>
<div>
<label for="BA_box">Box#:</label><br />
<input id="BA_box" name="BA_box" type="text" size="32" maxlength="128" value = "" /><br />
</div>
<div>
<label for="BA_destdate">Destroy date:</label>
<input id="BA_destdate" name="BA_destdate" type="text" size="32" maxlength="128" value = "" /><br />
</div>
</fieldset>
<div class="dialogTop_padd"></div>
<!--- fieldset for authorisation -->
<fieldset>
<legend>Authorisation</legend>
<div class="spacer"></div>
<div>
<label for="BA_authorised">Requested By:</label>
<input id="BA_authorised" name="BA_authorised" type="text" value="<?php echo $_SESSION['kt_name_usr']; ?>"><br />
</div>
</fieldset>
<!--- div to show callback result from ajax via dialog -->
<div id="BA_addbox"></div>
<br />
<input type="submit" name="submit" value="Submit Intake" />
<input type="reset" name="cancel" value="Clear Form" />
<!--- buttons to submit form and reset form to default status -->
<!-- <button id="BA_submit" class="submitbutton icon-right ui-state-default2 ui-corner-all"><span class="ui-icon ui-icon-circle-plus"></span>Add Box</button>
<button type="reset" id="BA_reset" class="resetbutton icon-right ui-state-default2 ui-corner-all"><span class="ui-icon ui-icon-circle-plus"></span>Reset</button>
--><br />
</form>
</div>
jquery code
$(function() {
$("#BA_customer").live('change', function() {
if($(this).val()!="")
$.get("/domain/admin/getDept.php?BA_customer=" + $(this).val(), function(data) {
$("#BA_dept").html(data).show();
});
$.get("/domain/admin/getOptions.php?BA_customer=" + $(this).val(), function(data) {
$("#BA_address").html(data).show();
});
});
});
//Begin function to submit box intake form
$(function() { // Function to add box
$("#boxaddform").dialog({
autoOpen: false,
resizable: false,
modal: true,
title: 'Submit a box intake request',
width: 550,
height: 400,
beforeclose: function (event, ui) {
$("#BA_addbox").html("");
$("#BA_dept").hide();
$("#BA_address").hide();
},
close: function (event, ui) {
//$("#BA_boxform").get(0).reset();
$("#BA_addbox").html("");
}
});
});
$(function(){
$("#boxaddform").submit(function(){
var formdata = $(this).serialize();
$.ajax({
type: "POST",
url: "/domain/admin/requests/boxes/boxesadd.php",
data: formdata,
dataType: 'json',
success: function(msg){
//$("#confirm_department").hide();
/*
var $dialog = $('<div id="dialog"></div>')
.html('Your intake was successfully submitted and will be viewable in the reporting area.<br /><br />Thank you.');
$dialog.dialog({
autoOpen: true,
modal: true,
title: 'Box intake submission successfull',
width: 400,
height: 200,
draggable: false,
resizable: false,
buttons: {
Close: function() {
$( this ).dialog( "close" );
}
}
});
*/
//alert('You have succesfully submitted your ' + msg.company + ' report. Thank you.');
//console.log(msg);
//$("#BA_addbox").html("You may now close this window.");
//$("#formImage .col_1 li").show();
$("#BA_boxform").get(0).reset();
$("#boxaddform").hide();
}
});
return false;
});
});
// End function to submit box intake form
php code
<?php
$dept = mysql_real_escape_string($_POST['BA_dept']);
$company = mysql_real_escape_string($_POST['BA_customer']);
$address = mysql_real_escape_string($_POST['BA_address']);
$service = mysql_real_escape_string($_POST['BA_service']);
$box = mysql_real_escape_string($_POST['BA_box']);
$destroydate = mysql_real_escape_string($_POST['BA_destdate']);
$authorised = mysql_real_escape_string($_POST['BA_authorised']);
$form = array('dept'=>$dept, 'company'=>$company, 'address'=>$address, 'service'=>$service, 'box'=>$box, 'destroydate'=>$destroydate, 'authorised'=>$authorised);
$result = json_encode($form);
echo $result;
?>
The problem in your code is that you are serializing a DIV, what is incorrect.
The solution would be to serialize only the FORM included in your DIV with a Javascript code like:
...
$(function(){
$("#boxaddform").submit(function(){
var formdata = $('#BA_boxform').serialize();
$.ajax({
type: "POST",
url: "/domain/admin/requests/boxes/boxesadd.php",
data: formdata,
dataType: 'json',
success: function(msg){
...
}
});
return false;
});
....
Also, remember that serialize will only care for INPUT, SELECTand TEXTAREA controls as a normal FORM submit would do (http://api.jquery.com/serialize/).