jQuery serialize() esclude tutti gli elementi all'interno div.classname

Sto tentando di escludere i valori invisibili del modulo dall'output jQuery serialize(). Ingressi/selezioni invisibili sono all'interno di div.ui-tabs-hide div's. Non i figli di esso, ma i discendenti. Quindi, in pratica, ho bisogno di includere tutti gli elementi (input, select) con wiin div's senza ui-tabs-hide class E escludere tutti gli elementi (input, select) all'interno di div con ui-tabs-hide class in un unico modulo.jQuery serialize() esclude tutti gli elementi all'interno div.classname

In questo momento con quello che ho provato include tutti gli elementi del modulo, ma penso di non aver specificato i selettori a destra.

Vedere sotto il codice per riprodurre il problema:

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       var formdata = $("#outboundcall:not(.ui-tabs-hide input, .ui-tabs-hide select)").serialize(); 

       console.log(formdata); 
      }); 
     </script> 
     <meta charset="utf-8" /> 
     <title>JS Bin</title> 
    </head> 
    <body> 
     <form id="outboundcall"> 
     <div class="content"> 
      <div class="tabs ui-tabs ui-widget ui-widget-content ui-corner-all"> 
       <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all"> 
        <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"> 
         <a href="#tabs-1">Credit Card</a> 
        </li> 
        <li class="ui-state-default ui-corner-top"> 
         <a href="#tabs-2">Cheque</a> 
        </li> 
        <li class="ui-state-default ui-corner-top"> 
         <a href="#tabs-3">Direct Debit</a> 
        </li> 
       </ul> 
       <div id="tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom"> 
        <input type="hidden" value="1" name="lead-payment-method" /> 
       </div> 
       <div id="tabs-2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide"> 
        <p>Cheque functionality is not currently available.</p> 
       </div> 
       <div id="tabs-3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide"> 
        <input type="hidden" value="3" name="lead-payment-method" /> 
       </div> 
      </div> 
     </div> 
     </form> 
    </body> 
</html>

Qui è jsbin con questo codice: http://jsbin.com/iyevux/5/

fonte

2013-04-29 Alexey

È possibile applicare :not() al vostro class selector, poi abbinare elemento figli modulo con il selettore di :input:

var formdata = $("#outboundcall :not(.ui-tabs-hide) > :input").serialize();

fonte

2013-04-29 09:33:37

ha appena provato questo: http://jsbin.com/iyevux/8/ e stil it registra i valori di entrambi gli input. O mi sono perso qualcosa? – Alexey

@Alexey, infatti, avrei dovuto usare un selettore figlio invece di un selettore discendente. La risposta è ora risolta. –

Grande, grazie! funziona: http://jsbin.com/iyevux/14/ – Alexey

Prova questo:

$(document).ready(function() { 
    var formdata = $("#outboundcall:not(.ui-tabs-hide) input,#outboundcall:not(.ui-tabs-hide) select").serialize(); 
    console.log(formdata); 
});

$(document).ready(function() { 
    var formdata = $("#outboundcall").find(":input:not(:hidden)").serialize(); 
    console.log(formdata); 
});

Da jQuery: form serialize, hidden fields, and not displayed fields

fonte

2013-04-29 09:41:32

prima opzione: http://jsbin.com/iyevux/11/ (registra ancora entrambi i valori) – Alexey

seconda opzione: http://jsbin.com/iyevux/ 12/(registra la stringa vuota) – Alexey

Ciò funzionerà:

$(document).ready(function() { 
    var formdata = $("#outboundcall input").not(".ui-tabs-hide input").serialize(); 

    console.log(formdata); 
});

dispiace precedenza non capivo del tutto la questione, cancellerà quella risposta

fonte

2013-04-29 09:56:20 dexterous

jQuery serialize() esclude tutti gli elementi all'interno div.classname

risposta

Problemi correlati