0

Estou com problema ao enviar o valor de um input para outro input readonly, o meu objetivo é que seja adicionado o texto que está no primeiro input no outro input ao clicar no botão Add, estou neste momento a testar com Javascript mas sou meio novato no que toca a essa linguagem.

Este é o meu layout: inserir a descrição da imagem aqui

Este é o meu script:

$(".btnNomes").click(function () {
    var nome = $(".inputNome");
    $("#textNome").text(nome.val());
});

Este é o meu código:

<div class="form-row"> <!--Nomes-->
    <div class="form-group col-md-5">
        <label for="inputNome">Nome</label>
        <input type="text" name="inputNome" class="form-control" id="inputNome" placeholder="Nome">
    </div>
    <button type="button" id="btnNomes" name="btnNomes"class="btn col-md-1 mx-1 px-0 my-auto btn-danger">Add</button> <!--Btn Add-->
    <input type="text" class="form-control col-md-5 my-auto" id="textNome" name="textNome" placeholder="Nomes..." readonly /> <!--Readonly Input-->
</div>

Obrigado :)

2 Respostas 2

3

Bom Dia eu fiz usando o getElementById e setando valores.

function setValue () {
    var nome = document.getElementById('inputNome').value;
    document.getElementById('textNome').value = nome;
};
<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>

<div class="form-row"> <!--Nomes-->
    <div class="form-group col-md-5">
        <label for="inputNome">Nome</label>
        <input type="text" name="inputNome" class="form-control" id="inputNome" placeholder="Nome">
    </div>
    <button type="button" onclick="setValue()" id="btnNomes" name="btnNomes"class="btn col-md-1 mx-1 px-0 my-auto btn-danger">Add</button> <!--Btn Add-->
    <input type="text" class="form-control col-md-5 my-auto" id="textNome" name="textNome" placeholder="Nomes..." readonly/> <!--Readonly Input-->
</div>

1

Faça a seguinte alteração no seu script:

$( document ).ready(function() {
	$("#btnNomes").click(function () {
		console.log('teste');
		var nome = $("#inputNome");
		$("#textNome").val(nome.val());
	});
});
<script
  src="https://code.jquery.com/jquery-3.4.0.slim.min.js"
  integrity="sha256-ZaXnYkHGqIhqTbJ6MB4l9Frs/r7U4jlx7ir8PJYBqbI="
  crossorigin="anonymous"></script>
<div class="form-row"> <!--Nomes-->
    <div class="form-group col-md-5">
        <label for="inputNome">Nome</label>
        <input type="text" name="inputNome" class="form-control" id="inputNome" placeholder="Nome">
    </div>
    <button type="button" id="btnNomes" name="btnNomes"class="btn col-md-1 mx-1 px-0 my-auto btn-danger">Add</button> <!--Btn Add-->
    <input type="text" class="form-control col-md-5 my-auto" id="textNome" name="textNome" placeholder="Nomes..." readonly /> <!--Readonly Input-->
</div>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .