jQuery sérialiser comment faire pour éliminer les champs vides

Dans ce formulaire, les utilisateurs peuvent ajouter des infos pour les Auteurs (musique, paroles d'auteurs)

Les utilisateurs ont la possibilité d'ajouter 1 ou plusieurs auteurs.

Le problème est que lorsque l'utilisateur ne saisit que 1 auteur de tous les autres intrants restent vides, mais le jQuery fonction serialize mettre de toute façon dans l'URL et le serveur me donne cette erreur:

Request-URI Too Large

Voir l'exemple ci-dessous:

echo "<form action=\"\" id=\"submForm\" name=\"submForm\" method=\"get\">";
//AUTHOR NUMBER 1
echo "<p><span class=\"labelInput\">".(_t('_cR_name'))." </span><input id=\"nameAuthor\" name=\"author[0][name]\" value=\"\" type=\"text\" class=\"commonInput\"></p>"; 
echo "<p><span class=\"labelInput\">".(_t('_cR_DOB'))." </span><input id=\"DOBAuthor\" name=\"author[0][DOB]\" value=\"\" type=\"text\" class=\"littleInput\"></p>"; 
echo "<p><span class=\"labelInput\">".(_t('_cR_DOD'))." </span><input id=\"DODAuthor\" name=\"author[0][DOD]\" value=\"\" type=\"text\" class=\"littleInput\"></p>"; 
//AUTHOR NUMBER 2
echo "<p><span class=\"labelInput\">".(_t('_cR_name'))." </span><input id=\"nameAuthor\" name=\"author[1][name]\" value=\"\" type=\"text\" class=\"commonInput\"></p>";
echo "<p><span class=\"labelInput\">".(_t('_cR_DOB'))." </span><input id=\"DOBAuthor\" name=\"author[1][DOB]\" value=\"\" type=\"text\" class=\"littleInput\"></p>"; 
echo "<p><span class=\"labelInput\">".(_t('_cR_DOD'))." </span><input id=\"DODAuthor\" name=\"author[1][DOD]\" value=\"\" type=\"text\" class=\"littleInput\"></p>"; Death:
//AUTHOR NUMBER 3
echo "<p><span class=\"labelInput\">".(_t('_cR_name'))." </span><input id=\"nameAuthor\" name=\"author[2][name]\" value=\"\" type=\"text\" class=\"commonInput\"></p>"; 
echo "<p><span class=\"labelInput\">".(_t('_cR_DOB'))." </span><input id=\"DOBAuthor\" name=\"author[2][DOB]\" value=\"\" type=\"text\" class=\"littleInput\"></p>"; 
echo "<p><span class=\"labelInput\">".(_t('_cR_DOD'))." </span><input id=\"DODAuthor\" name=\"author[2][DOD]\" value=\"\" type=\"text\" class=\"littleInput\"></p>"; 
echo "</form>";

Et c'est le code jQuery (il comprend également un valider la fonction, je suis sur jQuery 1.3.2)

echo "<script type=\"text/javascript\">
$(document).ready(function() {
 $('#submForm').validate({   
  submitHandler: function(form) {
  var serialized = $('#submForm').serialize()
  $.get('".$site['url']."modules/yobilab/copyright/classes/DO_submission.php', serialized);
    window.setTimeout('location.reload()', 8000);
return false;
  form.submit();    
  } 
})
});

Maintenant, imaginons que l'utilisateur va entrer dans les champs de l'AUTEUR 1 et laissera AUTEUR 2 et AUTEUR 3 vide. Comment dois-je dire à la jQuery fonction serialize à inclure dans l'URL SEULEMENT l'entrée des champs et de ne PAS inclure les champs vides?

double possible de Comment faire pour utiliser jQuery.sérialiser, mais excluent les champs vides

OriginalL'auteur DiegoP. | 2011-06-05

  1. 1

    Essayez d'ajouter ce

    $('input', '#submForm').each(function(){
    $(this).val() == "" && $(this).remove();
})

    OU

    $('input:text[value=""]', '#submForm').remove();

    avant

    var serialized = $('#submForm').serialize()
    ce n'est pas une bonne solution, car il modifie le dom et peut entraîner un élément de retournement. Si l'ajax échoue pour quelque raison que ce soit, il va provoquer des problèmes avec le formulaire, et aussi l'utilisation en général.

    OriginalL'auteur amit_g

  2. 12

    Je viens de tomber sur cette même question, mais avec un autre type de formulaire.
    Je n'aimais pas la façon dont plusieurs des réponses ici supprimé les éléments de formulaire, que vous pouvez voir les éléments prélevés sur la page avant la soumission du formulaire.
    D'autres cloné la forme, ce qui n'était pas de retourner tous les résultats pour moi avec l'une des formes.

    Je me suis donc retrouvé avec ce:

    $('#submForm').find('input').not('[value=""]').serialize();

    Dans mon cas, le code ci-dessus a travaillé sur mon choix de menus ainsi que les champs de saisie.

    Voici exactement ce que j'ai utilisé:

    $('#search').find('input, select').not('[value=""], [value="0"], [value="DESC"]').serialize();

    Donc il a tiré les champs de formulaire qui disposent de données et non pas les valeurs par défaut.
    Je suis curieux de savoir si cela peut être optimisé.

    OriginalL'auteur Francis Lewis

  3. 8

    Ce que je suis en utilisant un guichet automatique est

    $("form").serialize().replace(/[^&]+=&/g, '').replace(/&[^&]+=$/g, '')
    Il résout beaucoup, mec. Il a sauvé de temps pour moi.
    il m'a aidé , je vous remercie @sirfilip

    OriginalL'auteur sirfilip

  4. 5

    Vous pourriez faire usage d'un filtre et de le fait la sérialisation peut être appelée sur n'importe quel objet jQuery (cet exemple est uniquement destinée à montrer que vous pouvez sérialiser seuls les éléments vides et ne comprend <input> éléments de la forme):

    var serialized = $('#submForm').filter(function(){
                    return $(this).val();
                }).serialize();

    Voici un exemple de travail - laisser une ou plusieurs zones de texte vide et cliquez sur le bouton, vous allez voir la chaîne sérialisée des modifications pour inclure uniquement les non-zones de texte vides.

    OriginalL'auteur no.good.at.coding

  5. 4

    Comme le value attribut contient la valeur par défaut, pas le réel, j'ai pensé à utiliser cette:

    var queryString = $('form input').map(function () {
        return $(this).val().trim() == "" ? null : this;
    }).serialize();

    Avantages:

    • De la garniture de la valeur réelle, de sorte espaces /tabulation ne sera pas considéré comme vrai,
    • Il ne modifie pas l'élément DOM, donc en cas d'échec, il est toujours réutilisable.
    C'est vraiment la meilleure solution sur ce fil. C'est une honte, il n'y a pas plus de +1, vous avez mon vote Bigood 🙂
    sélecteur de solutions n'ont pas fonctionné pour moi, cela a fonctionné comme prévu! merci.

    OriginalL'auteur Bigood

  6. 0

    Tout d'abord faire vérifier si les champs ne sont pas vides. Ces succès de la pousser vers le tableau. Vous pouvez de sérialiser le tableau des éléments.

    En code s'il vous plaît. Je ne suis pas un jQuery programmeur. Je n'ai pas quelque chose à propos de jQuery..s'il vous plaît..Merci

    OriginalL'auteur kwicher

  7. 0

    Cela devrait fonctionner pour ce que vous essayez de faire :

    $(document).ready(function() {
    $('#submForm').validate({ 
        submitHandler: function(form) {
            //Do cleanup first
            $('#submForm>input').each(function(){
                if($(this).val() == "") { $(this).remove(); }
            });
            var serialized = $('#submForm').serialize();
            $.get('".$site['url']."modules/yobilab/copyright/classes/DO_submission.php', serialized);
            window.setTimeout('location.reload()', 8000);
            return false;
            form.submit(); 
        }
    })
});

    Modifier...

    Je pense vraiment que la Marque Koopman la solution serait l'option la plus simple. Est-il une raison pourquoi vous ne pouvez pas utiliser POST au lieu de GET?

    Edit 2...

    Oups, j'ai totalement raté que amit_g posté cette même solution. Mais j'espère au moins le voir dans le contexte était encore utile.

    OriginalL'auteur eksith

  8. 0

    J'ai juste besoin de faire la même chose, j'ai donc écrit un petit plugin qui vient de vide désactive les entrées avant de sérialisation:

    (function($) {
  $.fn.serialize_without_blank = function () {
    var $form = this,
      result,
      $disabled = $([]);

    $form.find(':input').each(function () {
      var $this = $(this);
      if ($.trim($this.val()) === '' && !$this.is(':disabled')) {
        $disabled.add($this);
        $this.attr('disabled', true);
      }
    });

    result = $form.serialize();

    $disabled.removeAttr('disabled');

    return result;
  };
}(jQuery));

    Utiliser comme:

    $.ajax({
  url: $form.attr('action'),
  type: $form.attr('method'),
  data: $form.serialize_without_blank();
});

    OriginalL'auteur Samuel Cole

  9. 0

    Dr Molle solution fonctionne, mais si la valeur de l'attribut est manquant, alors c'est la solution:-

    $(form).clone().find("input").each(function() {
    if ($.trim($(this).val()) === '') {
        $(this).remove();
    }
}).end().serialize();
    Au lieu de clonage le formulaire pour obtenir autour de la suppression de champs à partir de la DOM, @Bigood a une meilleure solution: stackoverflow.com/a/21558837/413538

    OriginalL'auteur Kaushik

  10. 0
    var serializedData = $('.register-form').serializeArray();
var clear = {};
$.each(serializedData , function(i,data) {                                       
if(data.value!=='' && clear[data.name]==undefined) clear[i] = data;                                      
                                    });

    OriginalL'auteur Виталий Дергунов

  11. 0

    Voici ce que j'ai fait

    var form = $('form');
var form_input = form.serialize().replace(/[^=&]+=(&|$)/g,"").replace(/&$/,"");

    OriginalL'auteur Alex