如何使用ajax将数据传递给php？

Question

I want to display a message according to the className passed to server using AJAX . I'm new ajax , I have no idea about that..

myhtml code :

<div class="header">
        <h2>Configuration</h2>
        <p> Enable: </p> <i class="fas fa-toggle-off " id="enable-btn"></i>
        <span id="demo">Dashboard Enabled</span>
    </div>

myJS code :

function enableButtonClicked() {
    $(document).ready(function () {
        $('#enable-btn').click(function () {
            $( ".dashboard, #demo" ).toggle();
            $(this).toggleClass("fa-toggle-off fa-toggle-on");
        });
    }); 
}

ajax code :

function displayMessageAccordingToButtonState() {
    var x = document.getElementById('enable-btn').className;
    if( x == 'fas fa-toggle-off'){
        var msg = "Button Disabled"
        $('.header').load('request.php',{"displayMsg":msg});
    }
    else {
        var msg = "Button Enabled"
        $('.header').load('request.php',{"displayMsg":msg});
    }

}

php code :

<?php
   if( $_REQUEST["displayMsg"] ){
      $msg = $_REQUEST['displayMsg'];
      echo "".$msg ;
   }
?> 

Answer 1

in JS

var request = $.ajax({
        async: false,
        url: 'Php.file', / your php file path
        type: "POST",
        data: "Value1=your value";
        datatype: 'html',
    });
    request.done(function(data) {
        //data you will handle from php file
    });

in PHP receive

$data = $_POST['data'];
  //you can check like this
  if(empty($data))
  {
    echo("none received");
  }
  else{
   echo 'passed parameter '+$data;
   //in here you will receive as data in js file
you will receive in data in js as 'passed parameter+ your value'
  }