web-dev-qa-db-fra.com

Jquery obtenir la valeur du champ de formulaire

J'utilise un modèle jQuery pour générer dynamiquement plusieurs éléments sur la même page. Chaque élément ressemble à ceci

<div id ="DynamicValueAssignedHere">
    <div class="something">Hello world</div>
    <div class="formdiv">
        <form name="inpForm">
            <input type="text" name="FirstName" />
            <input type="submit" value="Submit" />
        </form>
    </div>
</div>

J'aimerais utiliser Jquery pour traiter le formulaire lors de l'envoi. J'aimerais également rétablir les valeurs précédentes des formulaires si quelque chose n'allait pas. Ma question est. Comment puis-je obtenir la valeur de la zone de saisie à l'aide de Jquery? Par exemple, je peux obtenir la valeur de la div avec la classe "quelque chose" en faisant

var something = $(#DynamicValueAssignedHere).children(".something").html();

De la même manière, je veux pouvoir récupérer la valeur de la zone de texte. En ce moment, j'ai essayé

var text = $(#DynamicValueAssignedHere).children(".formdiv").findnext('input[name="FirstName"]').val();

mais cela ne semble pas fonctionner

javascriptjquery
65
user1625066

Vous devez utiliser value attribute pour obtenir sa valeur

<input type="text" name="FirstName" value="First Name" />

essayer - 

var text = $('#DynamicValueAssignedHere').find('input[name="FirstName"]').val();
122
Dipak

Cela peut être beaucoup plus simple que ce que vous faites.

HTML:

<input id="myField" type="text" name="email"/>

JavaScript:

// getting the value
var email = $("#myField").val();

// setting the value
$("#myField").val( "new value here" );
46
davidbuzatto

Une approche alternative, sans chercher le champ html:

var $form = $('#' + DynamicValueAssignedHere).find('form');
var formData = $form.serializeArray();
var myFieldName = 'FirstName';
var myFieldFilter = function (field) {
  return field.name == myFieldName;
}
var value = formData.filter(myFieldFilter)[0].value;
5
Lucas Moeskops

si vous connaissez l'id des entrées, vous devez seulement utiliser ceci:

var value = $("#inputID").val();
2
Severiano
var textValue = $("input[type=text]").val()

cela donnera toutes les valeurs de toutes les zones de texte. Vous pouvez utiliser des méthodes telles que children, firstchild, etc. pour y travailler. Comme par la forme $ ('form [nom = formulaire1] entrée [type = texte]') Il est plus facile d'utiliser des identifiants pour cibler des éléments, mais s'il est purement dynamique, vous pouvez obtenir toutes les valeurs d'entrée puis le parcourir en boucle avec JS.

2
Alex Reynolds

$("form").submit(function(event) {
    
      var firstfield_value  = event.currentTarget[0].value;
     
      var secondfield_value = event.currentTarget[1].value; 
     
      alert(firstfield_value);
      alert(secondfield_value);
      event.preventDefault(); 
     });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="" method="post" >
<input type="text" name="field1" value="value1">
<input type="text" name="field2" value="value2">
</form>

1
Milan Krushna
// for getting the value from input type text
var value = $("input[type=text]").val();
// for getting the value from by input type name
var textValue = $("input[name=text]").val()
1
Manmeet Khurana

Vous pouvez essayer ces lignes:

$("#DynamicValueAssignedHere .formdiv form").contents().find("input[name='FirstName']").prevObject[1].value
0
user3563774

Vous pouvez obtenir n'importe quelle valeur de champ de saisie par $('input[fieldAttribute=value]').val()

voici un exemple

displayValue = () => {

  // you can get the value by name attribute like this
  
  console.log('value of firstname : ' + $('input[name=firstName]').val());
  
  // if there is the id as lastname
  
  console.log('value of lastname by id : ' + $('#lastName').val());
  
  // get value of carType from placeholder  
  console.log('value of carType from placeholder ' + $('input[placeholder=carType]').val());

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="formdiv">
    <form name="inpForm">
        <input type="text" name="firstName" placeholder='first name'/>
        <input type="text" name="lastName" id='lastName' placeholder='last name'/>
        
        <input type="text" placeholder="carType" />
        <input type="button" value="display value" onclick='displayValue()'/>
        
    </form>
</div>

0
NuOne T Attygalle