Play js variable in html

Asked

Viewed 81 times

0

I made two inputs date, and when I click on "generate" it shows on the console the product that has these dates, but it is a variable, how do I turn a class and play in html? there every time I call the class it appears, ex.: <h2 class="produto-1"></h2> Then he’d show up. Obs.: it takes the product from an api that I made.

Code:

 <body>

    <input type="date" id="inicio">
    <input type="date" id="fim">
        <button onclick="PostData();">GERAR</button>
<!-- -->


    <script>
        function PostData() {
            var inicio,fim;
            inicio = document.getElementById('inicio').value;
            fim = document.getElementById('fim').value;
                fetch('http://localhost/api', {
                    method: 'POST',
                    headers: {'Content-Type':'application/x-www-form-urlencoded'},
                    body: `inicio=${inicio}&fim=${fim}`
                }).then(response => response.json().then(data => ({
                    data: data,
                    status: response.status
                })
                ).then(res => {
                    var insere = (res.data.dados.nome);
                    console.log(insere);
                })
                    )
        }

    </script>

 </body>
javascript html jquery

1 answer

0


Do the following, first create the element in your html as follows: <h2 class="produto-1"></h2>, below the console.log that you gave to show, do the following: $('.produto-1').html(insere); and see the result.

A basic example:

function PostData(){
   var r = $('#inicio').val();
   $('.produto-1').html(r);

}
<input type="date" id="inicio">
    <input type="date" id="fim">
        <button onclick="PostData();">GERAR</button>
<!-- -->
<h2 class="produto-1"></h2>


    
        





<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

The difference is that you’ll be picking up the content via ajax.

Browser other questions tagged javascript html jquery

You are not signed in. Login or sign up in order to post.