jQuery serialize() Wyklucz wszystkie elementy div.classname

Próbuję wykluczyć niewidoczne wartości formularzy z serialize() wyjście jQuery. Niewidoczne wejścia/wybory znajdują się wewnątrz div.ui-tabs-hide div's. Nie dzieci tego, ale potomkowie. Zasadniczo, muszę uwzględnić wszystkie elementy (input, select) witin div bez ui-tabs-hide class ORAZ wyklucz wszystkie elementy (input, select) w div z klasy ui-tabs-hide w jednej formie.jQuery serialize() Wyklucz wszystkie elementy div.classname

W tej chwili z tym, co próbowałem, zawiera wszystkie elementy formularza, ale myślę, że nie określiłem poprawnie selektorów.

Zobacz poniżej kod, aby odtworzyć problem:

<!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>

Oto jsbin z tym kodem: http://jsbin.com/iyevux/5/

Źródło

2013-04-29 Alexey

Można zastosować :not() do class selector, a następnie dopasować element formularz dzieci z selektora :input:

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

Źródło

2013-04-29 09:33:37

właśnie wypróbował to: http://jsbin.com/iyevux/8/ i stil to rejestruje wartości obu wejść. Czy też coś mi umknęło? – Alexey

@Alexey, rzeczywiście, powinienem był użyć selektora podrzędnego zamiast selektora potomka. Odpowiedź jest teraz rozwiązana. –

Świetnie, dzięki! działa: http://jsbin.com/iyevux/14/ – Alexey

Spróbuj tego:

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

lub

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

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

Źródło

2013-04-29 09:41:32

pierwsza opcja: http://jsbin.com/iyevux/11/ (nadal rejestruje obie wartości) – Alexey

druga opcja: http://jsbin.com/iyevux/ 12/(loguje pusty ciąg znaków) – Alexey

to będzie działać:

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

    console.log(formdata); 
});

Niestety wcześniej nie rozumiem pytanie całkowicie usunie tę odpowiedź

Źródło

2013-04-29 09:56:20 dexterous

jQuery serialize() Wyklucz wszystkie elementy div.classname

Odpowiedz

Powiązane problemy