无法使用 javascript 将 textarea 的值传递给 PHP 脚本 ECHO

Question

I am trying to get the value of textarea using JavaScript to pass it to PHP without reloading the page.

Please where might I have the issue here ?

This the Javascript to get the value from textarea and transfer it to PHP to be used

function getValue(s){    
    $.post(
        "reply.php", 
        {      
            getTxt: s,
        },    
        function(data,status){
             $("#ReplyTextField").html(data);
        }
    );
}

here is the HTML Textarea with reply button

<!-- reply popup -->
<div class="sitemodal fade" id="reply-popup">
    <div class="sitemodal-dialog">

      <!-- siteModal content-->
      <div class="sitemodal-content">
        <div class="sitemodal-header">
          <button type="button" class="close-popup">&times;</button>
          <h4 class="sitemodal-title">Reply</h4>
        </div>
        <div class="sitemodal-body">
          <form enctype="multipart/form-data" method="Post" action="<?php echo "reply.php?message=" . $row['id'] . "'"; ?>" name="msgform">
            <textarea id="ReplyTextField" placeholder="Give your Reply" name="textarea1"></textarea>
          </form>
        </div>
        <div class="sitemodal-footer">
          <button type="button" class="popup-btn reply" id="replyButton" name="sendmsg" onclick="getValue()">Reply</button>

        </div>
      </div>

    </div>
</div>

This is the php script in reply.php file i am trying to transfer the data to

<?php
/*include("functions.php");
include("session.php");
require("connection.php");*/

$getTxt= $_REQUEST['getTxt'];
echo $getTxt;

?>

Answer 1

Your PHP is fine. It is the HTML that is the issue. You were not sending the value which throws up an error in php. You have to send the variable in the onclick funtion and then it works.

Here is the Updated HTML file:

 function getValue(s){ $.post("reply.php", {getTxt: s,}, function(data,status){ $("#ReplyTextField").html(data);}); }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <p></p><div class="sitemodal fade" id="reply-popup"> <div class="sitemodal-dialog"> <!-- siteModal content--> <div class="sitemodal-content"> <div class="sitemodal-header"> <button type="button" class="close-popup">&times;</button> <h4 class="sitemodal-title">Reply</h4> </div> <div class="sitemodal-body"> <form enctype="multipart/form-data" method="Post" action="<?php echo `reply.php?message=` . $row['id'] . `'`; ?>" name="msgform"> <textarea id="ReplyTextField" placeholder="Give your Reply" name="textarea1"></textarea> </form> </div> <div class="sitemodal-footer"> <button type="button" class="popup-btn reply" id="replyButton" name="sendmsg" onclick="getValue(document.getElementById('ReplyTextField').value)">Reply</button> </div> </div> </div> </div>

Answer 2

The issue is that you are not passing any parameter to the getValue() function. I would avoid using the HTML onclick attribute and use a jQuery event handler instead:

$('#replyButton').on('click', function() {
    var textareaValue = $('#ReplyTextField').val();
    getValue(textareaValue);
};

You should also use the .val() method to set the value of the textarea. https://api.jquery.com/on/ https://api.jquery.com/val/