Обязательное поле, не работает в моде AJAX bootstrap

Question

Я изучил много случаев здесь с той же проблемой, но все еще не могу исправить мой код. Я пробовал много способов, но я не могу заставить его работать. Поэтому мне нужна ваша помощь, и если этот код может быть лучше.

Вот это модал:

<div class="modal-body">
    <label>Nombre Cliente</label>
    <input type="text" name="" id="nombre" class="form-control input" required>        
    <label>Tipo</label>
    <select class="custom-select" id="tipo1" name="tipo1" required></select>   
    <label>Marca</label>
    <select class="custom-select" id="marca1" name="marca1" required></select>
</div>
<div class="modal-footer">
    <button type="submit" class="btn btn-warning" id="agregardatos" data-dismiss="modal">Agregar Registro</button>
</div>

Вот функция ajax

$('#agregardatos').click(function(){
    tipo=$('#tipo1').val();
    marca=$('#marca1').val();
    nombre=$('#nombre').val();

    agregardatos(nombre,tipo,marca);
});

function agregardatos(nombre,tipo,marca){
    cadena="tipo=" + tipo +
        "&marca=" + marca +
        "&nombre=" + nombre;

    $.ajax({
        type:"POST",
        url:"agregardatos.php",
        data:cadena,
        success:function(r){
            if(r==1){
                $('#tabla').load('tablacabe2.php');
            }
        }
    });
}

Спасибо!