Receive text typed in input text, put in variable and apply in link

Question

Receive text typed in input text, put in variable and apply in link

Asked 5 years, 6 months ago

Viewed 1,571 times

0

I want to receive the text in a field typed by the user and, when clicking on Ubmit, it will be generated a link with the text and sent to Whatsapp as in the code below:

<form action="https://api.whatsapp.com/send?phone='.$telefone.'&text='.$texto.'" method="POST" target="_blank">
    <input type="text" name="text" placeholder="Digite sua mensagem..." autocomplete="off">
    <button class="trwpwhatsappsendbutton" name="enviar" type="submit">
        <i class="fa fa-paper-plane-o"></i>
    </button>
</form>

How can I do that?

2 answers

Browser other questions tagged php input whatsapp

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

by CypherPotato • **9,292** points · Answer 1 · 2019-05-13T18:00:20+00:00

In this code nothing will occur, since this action is totally wrong. action should call a POST API, but without passing parameters with PHP name on it.

What you want to do would be more or less:

<?php    
if(isset($_POST['telefone'])){
   $telefone = $_POST['telefone'];
   $texto    = $_POST['texto'];

   $resposta = file_get_contents("https://api.whatsapp.com/send?phone=" . $telefone . "&text=" . $texto);

   echo $resposta;
}    
?>

<html>
   <body>    
      <form action="" method="post">
          <?php echo $resposta; ?>
          <input type="text" name="telefone"/>
          <input type="text" name="texto"/>
          <input type="submit" name="SubmitButton"/>
      </form>    
   </body>
</html>

Even so, it is not recommended. It is recommended to make use of jQuery, with each code in separate files, in the form of:

HTML ---> FORM ---> jQuery ---> PHP ---> WhatsApp API

You can even directly call the Whatsapp API from the form, assuming:

<form action="https://api.whatsapp.com/send/" method="POST" target="_blank">
    <input type="text" name="text" placeholder="Digite sua mensagem..." autocomplete="off">
    <input type="text" name="phone" placeholder="Insira o telefone (com o +55)..." autocomplete="off">
    <button class="trwpwhatsappsendbutton" name="enviar" type="submit">
        <i class="fa fa-paper-plane-o"></i>
    </button>
</form>

In this way, text and phone would be sent to the API.

by Victor Carnaval • **2,430** points · Answer 2 · 2019-05-13T19:45:29+00:00

Just manipulate the event submit of the form and make the necessary amendments.

$(function() {
  $('#send-message-whatsapp').on('click', 'button', function(e) {
    e.preventDefault();

    const $form = $("#send-message-whatsapp");
    const phone = '5512999999999';
    const text = $form.children('input[name="text"]').val();
    const action = "https://api.whatsapp.com/send?phone=" + phone + "&text=" + text;

    $form.attr('action', action);
    $form.attr('target', '_blank');
    $form.submit();
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<form id="send-message-whatsapp">

  <input type="text" name="text" placeholder="Digite sua mensagem..." autocomplete="off">

  <button class="trwpwhatsappsendbutton" name="enviar" type="submit">Enviar</button>

</form>