Embedded Form Mailchimp does not redirect to destination page

Question

Follow the code of the Form I am working, the problem is the following, using it as it is, is not redirecting to the link of the e-book that I would like, I tried to put > onClick=this.form.action='https://www.pmextech.com/wp-content/uploads/2018/04/e-BOOK_GUIA_BASICO_INOVACAO_.pdf';this.form.Submit(); < on the button, but there I can’t get it to only direct after the fields are filled in.

<link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
	#mc_embed_signup{
        background:#edba30; 
        clear:left; 
        font:14px Helvetica,Arial,sans-serif; 
    }
    #receber_e-book { 
        background-color: #000 !important;
        border: solid;
        cursor: pointer;
        
    }
    #receber_e-book:hover {background-color: #696869 !important; }
    #mce-EMAIL{background-color:#fff;}
    #mce-FNAME{background-color:#fff;}
    #mce-PHONE{background-color:#fff;}
    #mce-CARGO{background-color:#fff;}
    #mce-SPROJETO{
        background-color:#fff; 
        border: 1px solid #ABB0B2; 
        height: 30px;
        width: auto;
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        text-shadow: none;
        color: #000;
        border-radius: 3px;

    }
    #mce-GQPROJETO{
        background-color:#fff; 
        border: 1px solid #ABB0B2; 
        height: 30px; 
        width: auto;
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        text-shadow: none;
        color: #000;
        border-radius: 3px;
        
    }
    
</style>

<div id="mc_embed_signup">
<form action="https://pmextech.us18.list-manage.com/subscribe/post?u=7f006475c853db80b170d5153&amp;id=24f0ae88ad" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
    <div id="mc_embed_signup_scroll">
<br>        
<h4><center><font color="#fff">Informe os seus dados para acessar o guia de Criatividade e Inovação</font></center></h4>

<p><center><font color="grey">_______________________________</font></center></p>

<br>
<div class="indicates-required"><span class="asterisk">*</span><font color="#fff">indicates required</font></div>

<div class="mc-field-group">
	<label for="mce-EMAIL"><font color="#fff">Email</font><span class="asterisk">*</span>
</label>
	<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
</div>

<div class="mc-field-group">
	<label for="mce-FNAME"><font color="#fff">Nome</font><span class="asterisk">*</span>
</label>
	<input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
</div>

<div class="mc-field-group">
	<label for="mce-PHONE"><font color="#fff">Telefone</font></label>
	<input type="text" name="PHONE" class="" value="" id="mce-PHONE">
</div>

<div class="mc-field-group">
	<label for="mce-CARGO"><font color="#fff">Cargo</font><span class="asterisk">*</span>
</label>
	<input type="text" value="" name="CARGO" class="required" id="mce-CARGO">
</div>

<div class="mc-field-group">
	<label for="mce-SPROJETO" style="margin-top: 4px;"><font color="#fff">Sobre seu Projeto</font><span class="asterisk">*</span>
</label>
	<select name="SPROJETO" class="required" id="mce-SPROJETO" style='text-transform:lowercase'>
	<option value="none" selected hidden disabled>Selecione uma opção</option>
	<option value="Sou inventor / Desenvolvedor">Sou inventor / Desenvolvedor</option>
    <option value="Estou Empreendendo">Estou Empreendendo</option>
    <option value="A Inovação / Projeto será realizada dentro da minha empresa">A Inovação / Projeto será realizada dentro da minha empresa</option>

	</select>
</div>

<div class="mc-field-group">
	<label for="mce-group[2925]" style="margin-top: 5px;"><font color="#fff">Qual a fase de seu projeto</font></label>
	<select name="group[2925]" class="REQ_CSS" id="mce-GQPROJETO" style='text-transform:lowercase'>
	<option value="none" selected hidden disabled>Selecione uma opção</option>
	<option value="1">Tenho a ideia mas não sei como avançar</option>
<option value="2">Tenho o projeto estruturado mas não sei se minha inovação será viável</option>
<option value="4">Tenho o projeto estruturado mas não sei como executar</option>

	</select>
</div>

	<div id="mce-responses" class="clear">
		<div class="response" id="mce-error-response" style="display:none"></div>
		<div class="response" id="mce-success-response" style="display:none"></div>
    </div>
       
    <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_7f006475c853db80b170d5153_24f0ae88ad" tabindex="-1" value=""></div>
    <br>
    <br>
    <div class="clear"><center><input type="submit" value="Receber Material" name="subscribe" id="receber_e-book" class="button" style="padding: 30px 20px; line-height:1px;" ></center></div>
    </div>
    <br>
    <center><font color="#fff">&nbsp;&nbsp;&nbsp;&nbsp;Não fazemos spam. <img src="https://www.shareicon.net/data/16x16/2016/01/05/698510_hand_512x512.png"><br> <img src="https://www.shareicon.net/data/16x16/2016/01/05/698452_hand_512x512.png"> Seus dados estão seguros.</font></center>
    <br>

</form>
</div>

<!--JavaScript-->
<script type="text/javascript">
    document.getElementById('mce-EMAIL').onchange = function() {
    document.getElementById('mce-EMAIL').disabled = !this.checked;
};
    </script>


<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='PHONE';ftypes[2]='phone';fnames[3]='CARGO';ftypes[3]='text';fnames[4]='SPROJETO';ftypes[4]='dropdown';fnames[5]='QPROJETO';ftypes[5]='dropdown'; 

$.extend($.validator.messages, {
	required: "Campo de preenchimento obrigat&oacute;rio.",
	remote: "Por favor, corrija este campo.",
	email: "Por favor, introduza um endere&ccedil;o eletr&oacute;nico v&aacute;lido.",
	url: "Por favor, introduza um URL v&aacute;lido.",
	date: "Por favor, introduza uma data v&aacute;lida.",
	dateISO: "Por favor, introduza uma data v&aacute;lida (ISO).",
	number: "Por favor, introduza um n&uacute;mero v&aacute;lido.",
	digits: "Por favor, introduza apenas d&iacute;gitos.",
	creditcard: "Por favor, introduza um n&uacute;mero de cart&atilde;o de cr&eacute;dito v&aacute;lido.",
	equalTo: "Por favor, introduza de novo o mesmo valor.",
	accept: "Por favor, introduza um ficheiro com uma extens&atilde;o v&aacute;lida.",
	maxlength: $.validator.format("Por favor, n&atilde;o introduza mais do que {0} caracteres."),
	minlength: $.validator.format("Por favor, introduza pelo menos {0} caracteres."),
	rangelength: $.validator.format("Por favor, introduza entre {0} e {1} caracteres."),
	range: $.validator.format("Por favor, introduza um valor entre {0} e {1}."),
	max: $.validator.format("Por favor, introduza um valor menor ou igual a {0}."),
	min: $.validator.format("Por favor, introduza um valor maior ou igual a {0}.")
});}(jQuery));var $mcj = jQuery.noConflict(true);</script>

Answer 1

I found a way to solve my problem using jQuery

<script type="text/javascript">
    jQuery("#receber_e-book").prop('disabled', true);

    var toValidate = jQuery('#mce-EMAIL'),
    valid = false;
toValidate.keyup(function () {
    if (jQuery(this).val().length > 0) {
        jQuery(this).data('valid', true);
    } else {
        jQuery(this).data('valid', false);
    }
    toValidate.each(function () {
        if (jQuery(this).data('valid') == true) {
            valid = true;
        } else {
            valid = false;
        }
    });
    if (valid === true) {
        jQuery("#receber_e-book").prop('disabled', false);
    } else {
        jQuery("#receber_e-book").prop('disabled', true);
    }
});

<link href="//cdn-images.mailchimp.com/embedcode/classic-10_7.css" rel="stylesheet" type="text/css">
<style type="text/css">
	#mc_embed_signup{
        background:#edba30; 
        clear:left; 
        font:14px Helvetica,Arial,sans-serif; 
    }
    #receber_e-book { 
        background-color: #000 !important;
        border: solid;
        cursor: pointer;
        
    }
    #receber_e-book:hover {background-color: #696869 !important; }
    #mce-EMAIL{background-color:#fff;}
    #mce-FNAME{background-color:#fff;}
    #mce-PHONE{background-color:#fff;}
    #mce-CARGO{background-color:#fff;}
    #mce-SPROJETO{
        background-color:#fff; 
        border: 1px solid #ABB0B2; 
        height: 30px;
        width: auto;
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        text-shadow: none;
        color: #000;
        border-radius: 3px;

    }
    #mce-GQPROJETO{
        background-color:#fff; 
        border: 1px solid #ABB0B2; 
        height: 30px; 
        width: auto;
        box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
        text-shadow: none;
        color: #000;
        border-radius: 3px;
        
    }
    
</style>

<div id="mc_embed_signup">
<form action="ACTION URL" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
    <div id="mc_embed_signup_scroll">
<br>        
<h4><center><font color="#fff">Informe os seus dados para acessar o guia de Criatividade e Inovação</font></center></h4>

<p><center><font color="grey">_______________________________</font></center></p>

<br>
<div class="indicates-required"><span class="asterisk">*</span><font color="#fff">indicates required</font></div>

<div class="mc-field-group">
	<label for="mce-EMAIL"><font color="#fff">Email</font><span class="asterisk">*</span>
</label>
	<input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
</div>

<div class="mc-field-group">
	<label for="mce-FNAME"><font color="#fff">Nome</font><span class="asterisk">*</span>
</label>
	<input type="text" value="" name="FNAME" class="required" id="mce-FNAME">
</div>

<div class="mc-field-group">
	<label for="mce-PHONE"><font color="#fff">Telefone</font></label>
	<input type="text" name="PHONE" class="" value="" id="mce-PHONE">
</div>

<div class="mc-field-group">
	<label for="mce-CARGO"><font color="#fff">Cargo</font><span class="asterisk">*</span>
</label>
	<input type="text" value="" name="CARGO" class="required" id="mce-CARGO">
</div>

<div class="mc-field-group">
	<label for="mce-SPROJETO" style="margin-top: 4px;"><font color="#fff">Sobre seu Projeto</font><span class="asterisk">*</span>
</label>
	<select name="SPROJETO" class="required" id="mce-SPROJETO" style='text-transform:lowercase'>
	<option value="none" selected hidden disabled>Selecione uma opção</option>
	<option value="Sou inventor / Desenvolvedor">Sou inventor / Desenvolvedor</option>
    <option value="Estou Empreendendo">Estou Empreendendo</option>
    <option value="A Inovação / Projeto será realizada dentro da minha empresa">A Inovação / Projeto será realizada dentro da minha empresa</option>

	</select>
</div>

<div class="mc-field-group">
    <label for="mce-group[2925]" style="margin-top: 5px;"><font color="#fff">Qual a fase de seu projeto</font><span class="asterisk">*</span>
</label>
	<select name="group[2925]" class="REQ_CSS" id="mce-GQPROJETO" style='text-transform:lowercase'>
	<option value="none" selected hidden disabled>Selecione uma opção</option>
	<option value="1">Tenho a ideia mas não sei como avançar</option>
<option value="2">Tenho o projeto estruturado mas não sei se minha inovação será viável</option>
<option value="4">Tenho o projeto estruturado mas não sei como executar</option>

	</select>
</div>

	<div id="mce-responses" class="clear">
		<div class="response" id="mce-error-response" style="display:none"></div>
		<div class="response" id="mce-success-response" style="display:none"></div>
    </div>
       
    <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_7f006475c853db80b170d5153_24f0ae88ad" tabindex="-1" value=""></div>
    <br>
    <br>
    <div class="clear"><center><input type="submit" value="Receber Material" name="subscribe" id="receber_e-book" class="button" style="padding: 30px 20px; line-height:1px;" onclick="window.open ('URL Final destiny page')"></center></div>
    </div>
    <br>
    <center><font color="#fff">&nbsp;&nbsp;&nbsp;&nbsp;Não fazemos spam. <img src="https://www.shareicon.net/data/16x16/2016/01/05/698510_hand_512x512.png"><br> <img src="https://www.shareicon.net/data/16x16/2016/01/05/698452_hand_512x512.png"> Seus dados estão seguros.</font></center>
    <br>

</form>
</div>

<!--JavaScript-->
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='PHONE';ftypes[2]='phone';fnames[3]='CARGO';ftypes[3]='text';fnames[4]='SPROJETO';ftypes[4]='dropdown';fnames[5]='QPROJETO';ftypes[5]='dropdown'; 

    $.extend($.validator.messages, {
        required: "Campo de preenchimento obrigat&oacute;rio.",
        remote: "Por favor, corrija este campo.",
        email: "Por favor, introduza um endere&ccedil;o eletr&oacute;nico v&aacute;lido.",
        url: "Por favor, introduza um URL v&aacute;lido.",
        date: "Por favor, introduza uma data v&aacute;lida.",
        dateISO: "Por favor, introduza uma data v&aacute;lida (ISO).",
        number: "Por favor, introduza um n&uacute;mero v&aacute;lido.",
        digits: "Por favor, introduza apenas d&iacute;gitos.",
        creditcard: "Por favor, introduza um n&uacute;mero de cart&atilde;o de cr&eacute;dito v&aacute;lido.",
        equalTo: "Por favor, introduza de novo o mesmo valor.",
        accept: "Por favor, introduza um ficheiro com uma extens&atilde;o v&aacute;lida.",
        maxlength: $.validator.format("Por favor, n&atilde;o introduza mais do que {0} caracteres."),
        minlength: $.validator.format("Por favor, introduza pelo menos {0} caracteres."),
        rangelength: $.validator.format("Por favor, introduza entre {0} e {1} caracteres."),
        range: $.validator.format("Por favor, introduza um valor entre {0} e {1}."),
        max: $.validator.format("Por favor, introduza um valor menor ou igual a {0}."),
        min: $.validator.format("Por favor, introduza um valor maior ou igual a {0}.")
    });}(jQuery));var $mcj = jQuery.noConflict(true);</script>