Assign input to variable [closed]

2

I'm making a simple submission form. Basically: The user enters the value to be drawn, fills the data and clicking the confirm button, the result is displayed on the screen.

The problem is that I can not create this send function, so that the code only executes when the user clicks confirm. How to proceed?

Follow the code below:

<div class="form-group">
    <label class="col-md-4 control-label" for="textinput">Valor do saque</label>  
    <div class="col-md-2">
        <input id="textinput" name="textinput" value="" type="text" placeholder="R$ 00,00" class="form-control input-md" required="">
    </div>
</div>
    
asked by anonymous 19.01.2017 / 13:47

2 answers

1

As I understand it, you can do this:

With javascript

<button onclick="enviar()">Confirmar</button>

<script type="text/javascript">
    function enviar(){
        var valor = document.getElementById("textinput").value;
        alert(valor);

        return false;
    }
</script>

Or using jQuery :

<button id="confirmar">Confirmar</button>

<script type="text/javascript">
    $('body').on('click','#confirmar',function(){
        var valor = $('#textinput').val();
        alert(valor);

        return false;
    })
</script>
    
19.01.2017 / 14:00
0


The behavior of the example below will be as follows:
- Clicking the confirm button:
- It will display a warning with the value of the field "value";
- It will present in the scope the message of the value of the field "value";
- There will be no redirection on the page, since within the attribute is inserted onsubmit exists besides the function "showData ()", the "return false" that for the execution of submit.

HTML:

<div class="form-group">
<form method="post" action="" onsubmit="mostrarDados(); return false;">
    <label class="col-md-4 control-label" for="valor">Valor do saque</label>
    <div class="col-md-2">
        <input id="valor" name="valor" type="text" placeholder="R$ 00,00" class="form-control input-md">
    </div>
    <input type="submit" name="confirmar" value="Confirmar">
</form>
<div class="col-md-12" id="resultado"></div>


JAVASCRIPT:

<script type="text/javascript">
function mostrarDados(){
    valor = document.getElementById("valor").value;

    // MOSTRARÁ O VALOR IMPRESSO NA TELA
    document.getElementById("resultado").innerHTML = "Valor: "+valor+"<br>";

    // MOSTRARÁ UM AVISO
    alert("Valor: "+valor);
}

    
19.01.2017 / 14:33