0
J'essaie de créer un bouton de mise à jour pour mes lignes de tableau. Mes Ajouter Bouton Ouvrir les champs de saisie de formulaire, Mon Masquer Bouton Masquer, Le Modifier Le bouton modifie les champs Table TR.Bouton de mise à jour de la table jquery
Le bouton Envoyer Crée un nouveau TR avec le nouveau texte que j'ai placé dans les champs. Je veux aussi un bouton de mise à jour de côté le soumettre. Quand je modifie un TR Raw et y mettre autre chose. Lorsque je presse la mise à jour pour changer ce texte TR.
Aidez-moi à résoudre ce problème.
Voici mon actuelle HTML/jquery.js Script
<!DOCTYPE html>
<html >
<head >
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<title ></title >
</head >
<body >
<form class="a" action="" method="post" hidden>
<input type="text" name="nume" id="btd1" value="" >
<input type="text" name="prenume" id="btd2" value="" >
<input type="text" name="email" id="btd3" value="" >
<input type="text" name="telefon" id="btd4" value="" >
<input type="text" name="parola" id="btd5" value="" >
<input type="button" id="submit" value="Submit" name="submit" />
</form >
<table border="2" >
<tr >
<td >Vlad</td >
<td >Andrei</td >
<td >vTask</td >
<td >Ceva</td >
<td >Alceva</td >
<td class="buttons">
<button class="add" >Add</button >
<button class="hide" >Hide</button >
<button class="edit" >Edit</button >
</td >
</tr >
</table >
</body >
</html >$(document).ready(function() {
$('#submit').on('click', function() {
var valid = true,
message = '';
$('form input').each(function() {
var $this = $(this);
if (!$this.val()) {
var inputName = $this.attr('name');
valid = false;
message += 'Please enter your ' + inputName + '\n';
}
});
if (!valid) {
alert(message);
} else {
$('table').append('' +
'<tr>' +
'<td>' + $('#btd1').val() + '</td>' +
'<td>' + $('#btd2').val() + '</td>' +
'<td>' + $('#btd3').val() + '</td>' +
'<td>' + $('#btd4').val() + '</td>' +
'<td>' + $('#btd5').val() + '</td>' +
'<td class="buttons" style="vertical-align: top"><button class="add" >Add</button><button class="hide" >Hide</button><button class="edit">Edit</button></td >'+
'</tr>' +
'');
for(var x = 1; x < $('input').length; x++) {
$('#btd' + x).val('');
}
}
});
$("body").on('click','.hide',function() {
$("form").hide();
});
$("body").on('click','.add',function() {
$("form").show();
});
$("body").on('click','.edit',function() {
$("form").show();
$.each($(this).closest('tr').find('td:not(".buttons")'), function (key, val) {
$("form input[type=text]").eq(key).val($(val).text());
})
});
$("#show").click(function() {
//$("form").show();
//$("#btd1").val("Vlad");
//$("#btd2").val("Andrei");
//$("#btd3").val("vTask");
// $("#btd4").val("Ceva");
//$("#btd5").val("Alceva");
});
});
Eh bien Noushad Ali, ce que je veux qu'il fasse maintenant, c'est quand j'appuie sur Editer sur n'importe quel brut. actuellement que brut est envoyé dans les champs de saisie de formulaire. Je veux écrire autre chose là-bas et puis appuyer sur un bouton de mise à jour pour changer l'information dans ce TR. Je suis chauve à expliquer. – Andrei224231
En bref, ce que je veux faire est d'écrire quelque chose aujourd'hui et peut-être dans une semaine les données dans ce TR va changer et je dois l'éditer pas l'ajouter en bas. J'ai besoin d'un bouton Mettre à jour à côté du bouton de soumission – Andrei224231
Je veux exactement ce que vous avez fait avec le bouton Modifier + Mise à jour mais le bouton Modifier pour lancer le texte dans les champs de saisie du formulaire comme dans mon code et le bouton de sauvegarde pour les enregistrer – Andrei224231