condition in onclick

Question

I intend to create a onclick button insert into database.

I have the following duties:

Insert function:

function inserir_registo()
{

    var dadosajax = {
        'Tipo' : $("#Tipo").val(),
        'Prioridade' : $("#Prioridade").val(),
        'Email' : $("#Email").is(":checked") ? $("#Email").val() : '',
        'Para' : $("#Para").val(),
        'Assunto' : $("#Assunto").val(),
        'Conteudo' : $("#Conteudo").val(),
        'De' : $("#De").val()
    };
    $.ajax({
        url: './inseriralerta',
        type: 'POST',
        cache: false,
        data: dadosajax,
        error: function(){

        },
        success: function(data)
        { 
        $('#formulario')[0].reset();
        }
    });
}

Function to check field:

function validarFormulario(){
    var myform = document.forms['formulario'] || document.formulario;
    if(myform.Tipo.value == "0" || myform.Tipo.selectedIndex == 0){
        alert('Campo Obrigatório!');
    }else{
        myform.submit();
    }
}

Knob:

<button type="button" data-toggle="modal" class="btn btn-success" onclick="if(validarFormulario() == 'OK') inserir_registo();">Enviar</button>

So the problem is I just want you to perform the function inserir_registo(); in the case of this function validarFormulario(); check that the field is filled, if it is not performing the function inserir_registo();

HTML:

<form id="formulario" name="formulario" method="POST">
       <div class="row clearfix">
        <div class="col_half1">
          <label>Tipo de Alerta</label>
          <div class="input_field">
            <select name="Tipo" id="Tipo">
            <option></option>
      <?php        
         $sql = "SELECT Discricao FROM raddb.TipoAlertas WHERE Id IN ('1','2','7')";
         $qr = mysqli_query($conn, $sql);
         while($ln = mysqli_fetch_assoc($qr)){
            echo '<option value="'.$ln['Discricao'].'">'.$ln['Discricao'].'</option>';
         }
      ?>        
    </select>
          </div>
        </div>
   <div class="form-group">
  <button type="button" class="btn btn-danger" data-dismiss="modal">Cancelar</button>
     <button type="button" data-toggle="modal" class="btn btn-success" onclick="if(validarFormulario() == 'OK') inserir_registo();">Enviar</button>
  </div>
</form> 

Answer 1

So, if I understood correctly what was missing there to validate the field and send the record was to call the function insert in the else, that is, if the field is valid:

var myform = document.forms['formulario'] || document.formulario;

function validarFormulario(){
    if(myform.Tipo.value == "0" || myform.Tipo.selectedIndex == 0){
        alert('Campo Obrigatório!');
    }else{
        inserir_registo()             // se o campo estiver válido insere o registro
    }
}

function inserir_registo() {
  myform.submit()                     // apenas para o exemplo
  
  /* var dadosajax = {
     'Tipo' : $("#Tipo").val(),
     .... 
  */   
}

<form id="formulario" name="formulario" method="POST">
  <select name="Tipo" id="Tipo">
    <option value="0">Vazio</option>
    <option value="1">Teste 1</option>
    <option value="2">Teste 2</option>
  </select>
  <button type="button" onclick="validarFormulario()">Enviar</button>
<form>

Answer 2

For it to be a valid codition, I believe you have to return something on function validarFormulario.

function validarFormulario(){
    var myform = document.forms['formulario'] || document.formulario;
    if(myform.Tipo.value == "0" || myform.Tipo.selectedIndex == 0){
        alert('Campo Obrigatório!');
    }else{
        myform.submit();
        return true;
    }
}

Then, just check whether this function will return true or not on the button.

<button type="button" data-toggle="modal" class="btn btn-success" onclick="if(validarFormulario() === true) inserir_registo();">Enviar</button>

You can even omit the === true.

<button type="button" data-toggle="modal" class="btn btn-success" onclick="if(validarFormulario()) inserir_registo();">Enviar</button>