Tenho meu código onde seleciono um item e o campo se adequa a cada caso. Quando é selecionado número o campo retorna um tipo dado a ser digitado e funciona bem (recebi a dica em outra pergunta que fiz por Marcelo Uchimura), porém, agora quero saber como fazer o campo ser autofocus required com java script já tentei de algumas formas e não deu certo. Em outros campos até tenho como fazer mas seguindo o exemplo deles sempre dá erro. Segue meu código:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.1.62/jquery.inputmask.bundle.js"></script>
<!--Script que esconde e mostra Divs-->
<script>
$(document).ready(function(){
$("#tipo").change(function(){
var filtro = $('#filtro');
var seletor = $('#seletor');
if( !$(this).val() || $(this).val().match(/^(contrato|cliente|cpf|solicitante)$/) )
filtro
.show()
.attr('required', true)
.focus();
else
filtro
.hide()
.attr('required', false);
if ($(this).val().match(/^numero$/)) {
$('#numero2').show();
} else {
$('#numero2').hide();
}
if( $(this).val() == "situacao")
seletor
.show()
.attr('required', true)
.focus();
else
seletor
.hide()
.attr('required', false);
});
});
</script>
<!--Fim Script que esconde e mostra Divs-->
<!--Campo Filtrar-->
<form method="get" action="pesquisas.php">
<div class="row">
<div class="col-sm-5">
<div class="input-group col-lg-12">
<div class="input-group-addon">
<span class="glyphicon glyphicon-search"></span>
</div>
<select required autofocus class="form-control" name="tipo" id="tipo">
<option value="">SELECIONAR</option>
<option value="situacao">SITUAÇÃO</option>
<option value="contrato">CONTRATO</option>
<option value="cliente">CLIENTE</option>
<option value="cpf">CPF</option>
<option value="numero">NÚMERO</option>
<option value="solicitante">SOLICITANTE</option>
</select></form></div></div>
<!--Fim Campo Filtrar-->
<!--Campo Situaçao-->
<div class="col-sm-2 col-lg-4" >
<select type="text" class="form-control" name="seletor" id="seletor" style="display: none">
<option value="">SELECIONAR</option>
<option value="solicitada">SOLICITADA</option>
<option value="portada">PORTADA</option>
<option value="cancelada">CANCELADA</option>
<option value="erro">ERRO</option>
</select>
</div>
<!--Fim Campo Situaçao-->
<div class="col-sm-21 col-lg-4">
<input type="text" id="numero2" name="numero2" class="form-control" style="display: none" maxlength="15" placeholder="(00) 0000-0000">
<script>
$(window).load(function()
{
var phones = [{ "mask": "(##) ####-####"}];
$('#numero2').inputmask({
mask: phones,
greedy: false,
definitions: { '#': { validator: "[0-9]", cardinality: 1}} });
});
</script>
</div>
<!--Fim Campo Filtrar-->
<div class="col-sm-2 col-lg-4" >
<input type="text" class="form-control" name="filtro" id="filtro"></div>
<!--Fim Campo de pesquisa escrita-->
<input type="submit" value="Pesquisar" class="btn btn-primary"><br><br>
</form>
</div>