Estou com problemas ao tentar validar campos de formulário, via Javascript, no navegador Safari.
O código HTML:
<div class="modal fade" id="remarcar" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div id="confirmacao-label1">
<a href="#close" title="Close" data-dismiss="modal" class="closeModal">X</a>
</div>
<div class="modal-body">
<form action="#" method="post" name="remarcar-cancelar" id="remarcar-cancelar">
<div id="button-label-remarcacao">
<span class="titulos">Por favor nos informe o motivo: </span>
<span class="titulos">Motivo: </span>
<select name="motivoCancelamento" id="motivoCancelamento" class="combobox-motivo" required="required">
<option value=""> </option>
<option value="viagem">Viagem</option>
<option value="outros">Outros Motivos</option>
</select>
</div>
<div id="button-label-remarcacao">
<button type="submit" name="remarcar" value="remarcar" id="remarcacao-submit"
onclick="return validaMotivoSituacaoSubmit();">Desejo Remarcar</button>
</div>
</form>
</div>
</div>
</div>
Que no botão chama a função JS:
<script>
function validaMotivoSituacaoSubmit() {
if (document.getElementById("motivoCancelamento").selectedIndex === 0) {
alert("Escolha uma opção!");
return false;
} else {
$("#remarcar-cancelar").attr("action", "MSAGEN");
document.forms["remarcar-cancelar"].submit();
return true;
}
}
</script>
As validações funcionam perfeitamente nos navegadores IE, Firefox, Chrome. Porém no Safari, a validação não funciona e caso o usuário não selecione nenhum motivo, envia parâmetro vazio ao servlet.
Alguém tem alguma dica?