CODEWITHSUNDEEP
jqueryserialization
Deviandorx
Deviandorx

Reputation: 59

send a multiple serialize form

I have a problem, I have a field with several forms, these forms can get to repeat up to 50 times but with different values​​, I want to send the form you select from the list with $. post ('process.php', $ ("# form") . serialize (), function (data), but when clicking on a form values ​​are sent only the first form but not send form values ​​to select.

try units themselves, those are two simple documents such

forms.html

<html>
<head>
<title>Ejemplo de form con jquery</title> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<script type="text/javascript">
$(function() {
$("form").validate( {
submitHandler: function(form) {
$.post('process.php', $(form).serialize(), function(data) {
$('#results').html(data);
            });
        }
    });
});
</script>
</head>
<body>
<form method="post" id="form">
    <label for="name" id="name_label">Nombre</label>  
    <input type="text" name="name" id="name" size="30" value=""/>  
    <br>

    <input type="submit" name="submit" value="SEND"> 
</form>

<form method="post" id="form">
    <label for="name" id="name_label">Nombre</label>  
    <input type="text" name="name" id="name" size="30" value=""/>  
    <br>
  <input type="submit" name="submit" value="SEND"> 
</form>

<form method="post" id="form">
    <label for="name" id="name_label">Nombre</label>  
    <input type="text" name="name" id="name" size="30" value=""/>  
    <br>
  <input type="submit" name="submit" value="SEND"> 
</form>

<form method="post" id="form">
    <label for="name" id="name_label">Nombre</label>  
    <input type="text" name="name" id="name" size="30" value=""/>  
    <br>
  <input type="submit" name="submit" value="SEND"> 
</form>

<form method="post" id="form">
    <label for="name" id="name_label">Nombre</label>  
    <input type="text" name="name" id="name" size="30" value=""/>  
    <br>
  <input type="submit" name="submit" value="SEND"> 
</form>
<div id="results"></div>
</body>
</html>

process.php

 <?php

    print "Form enviado correctamente: <br>the post value is <b>".$_POST['name']."</b> ";
?>

all I want is that if I put a value to the last form below and I will send you send the value of this form or any you choose, not the value of the form above that there is where the problem is and do not want q send the value of all forms at once ls just want to send the value of the form to select

Upvotes: 0

Views: 1450

Answers (3)

Tushar Gupta - curioustushar
Tushar Gupta - curioustushar

Reputation: 57105

$(function() {
      $("form").each(function() {
          $(this).validate( {
              submitHandler: function(form) {
                  $.post('process.php', $(form).serialize(), function(data) {
                      $('#results').html(data);
                  });
              }
          });
      });
  });

Upvotes: 0

vijay
vijay

Reputation: 444

Add forms with unique name and/or id. Note that the input type changed to button from submit.

<form method="post">
    <label for="name" id="name_label">Nombre</label>  
    <input type="text" name="name" id="name" size="30" value=""/>  
    <input type="button" value="SEND"> 
</form>
<form method="post">
    <label for="name" id="name_label">Nombre</label>  
    <input type="text" name="name" id="name" size="30" value=""/>  
    <input type="button" value="SEND"> 
</form>

then wire event handler

$('input[type=button]').click(function(e)) {
    $(this).parent('form').submit();
};

Better not to have two elements with the same id in the DOM.

Upvotes: 1

Jay Rizzi
Jay Rizzi

Reputation: 4304

Give each form a class or same name, then use $(.class).serialize();

And yes you shouldnt have elements in your html that have the same id attr val, defeates the purpose of a unique identifier, bad practice

Upvotes: 0

Related Questions