0

午後、私の質問は2つの連鎖フォームに関係します。ここでは、最初のフォームの値が検証され、OKの場合、2番目のフォームが表示されます（最初のフォームの入力フィールドが非アクティブになり、送信ボタンが非表示になります）。

私の質問は、最初のフォームから値を取得して、非表示フィールドとして2番目のフォームにアタッチするにはどうすればよいかということです。

私のコードは次のようになります：

<form id="upfotos_dados" action="POST">
     <p class="desc_nome"><strong>O seu nome: </strong></p>
     <input type="text" id="fotos_nome" />

     <p class="desc_email"><strong>O seu email: </strong></p>
     <input type="text" id="fotos_email" />

     <p class="desc_especie"><strong>Fotografias da espécie: </strong></p>
     <input type="text" size="20" id="fotos_especie" value="Asplenium Cetarach" disabled />

     <input value="Confirmar" type="submit" name="submit" class="button submit_dados" />
     <div class="clearfix"></div>
</form>

<form id="upload_imagens" action="javascript:$('#file_upload').uploadifive('upload')">
  <div id="queue"></div>
  <input id="file_upload" name="file_upload" type="file" multiple>
  <input value="Enviar Fotografias" type="submit" name="submit" class="enviafotos-button" /> 
</form>

そしてjQuery：

    $(document).ready(function(){
        $("#upload_imagens").hide();    
    });

    $('.submit_dados').live("click",function(){

        if($('#fotos_email').val() == ''){ $('#fotos_email').parent().find('.desc_email').append("<span style='color:#A00'>Campo obrigatório.</span>"); return false; }
        else if(!IsEmail($('#fotos_email').val()) ){ $('#fotos_email').parent().find('.desc_email').append("<span style='color:#A00'>Email incorrecto.</span>"); return false; }
        if($('#fotos_nome').val() == ''){ $('#fotos_nome').parent().find('.desc_nome').append("<span style='color:#A00'>Campo obrigatório.</span>"); return false; }
        if($('#fotos_especie').val() == ''){ $('#fotos_especie').parent().find('.desc_especie').append("<span style='color:#A00'>Campo obrigatório.</span>"); return false; }

        if($('#fotos_email').val() != '' && IsEmail($('#fotos_email').val()) && $('#fotos_nome').val() != '' && $('#fotos_especie').val() != ''){
            $("#upload_dados").hide();
            $("#upload_imagens").show();
            return false;
        }
    });

残念ながら、まだ正しく実行できていないフィールドの同時検証など、いくつかの作業はまだ進行中です。

4

3 に答える 3

1

1つではなく2つの別々のフォームが必要な理由はわかりませんが、考えられるアプローチの1つは、最初のフォームのすべての入力をループして、それらを子として2番目のフォームに追加することです。

$('#form1 input, #form1 select').each(function(index, element){
  $(#form2).append('<input type="hidden" name="'+$(element).attr('id')+'" value="'+$(element).val()+'">');
});

そのような何か、多分それはあなたが探しているものですか？

于 2012-10-26T13:35:06.990 に答える
1

これにより、upfotos_dadosからすべての入力を取得し、id->名前と値->値を使用して、upload_imagensに非表示の入力を追加する必要があります。

$("#upfotos_dados input").each(function() {
    $(#upload_imagens).append('<input type="hidden" name="'+this.id+'" value="'+this.value+'">');
});
于 2012-10-26T13:39:51.407 に答える
1

.submit_dadosクリックイベントハンドラーを変更できます。のようなリファクタリングコードを使用して、からの入力値upload_dadosをの非表示フィールドに追加しますupload_imagens。

また、これらの検証はすでに実行されているため、これらの値を追加するときに値を再度確認する必要はありません。

$('.submit_dados').on("click", function () {
    var parent =$("#upload_dados");
    var fotos_email = $('#fotos_email');
    var fotos_email_value = fotos_email.val();
    var fotos_nome = $('#fotos_nome');
    var fotos_nome_value = fotos_nome.val();
    var fotos_especie = $('#fotos_especie');
    var fotos_especie_value = fotos_especie.val();

    if (fotos_email_value == '') { parent.find('.desc_email').append("<span style='color:#A00'>Campo obrigatório.</span>"); return false; }
    else if (!IsEmail(fotos_email_value)) { parent.find('.desc_email').append("<span style='color:#A00'>Email incorrecto.</span>"); return false; }
    if (fotos_nome_value == '') { parent.find('.desc_nome').append("<span style='color:#A00'>Campo obrigatório.</span>"); return false; }
    if (fotos_especie_value == '') { parent.find('.desc_especie').append("<span style='color:#A00'>Campo obrigatório.</span>"); return false; }

    //if (fotos_email_value != '' && IsEmail(fotos_email_value) && fotos_nome_value != '' && fotos_especie_value.val() != '') {
    //var upload_dados = $("#upload_dados");
    parent.hide();
    var upload_imagens = $("#upload_imagens");

    parent.find('input').each(function () {
        upload_imagens.append($('<input/>').attr('type', 'hidden').attr('name', this.id).val(this.value));
    });
    return false;
    //}
});
于 2012-10-26T13:49:27.053 に答える