将$ _POST或PHP变量的值存储到Javascript变量中

将$ _POST或PHP变量的值存储到Javascript变量中

问题描述:

search.php

<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post">
      <input type="text" name="search" id="search" autocomplete="off">
      <button type="submit" class="btn btn-primary">Search</button>
</form>
    <?php $search = $_POST['search']; ?> // This is what I've tried.
    <script type="text/javascript" src="js/search.js"></script>

I've tried to added $search = $_POST['search']; and put it into search.js like this var searchTerm = "<?php echo $search; ?>";

search.js

 var ajax_arry=[];
 var ajax_index =0;
 var sctp = 100;
 $(function(){
   $('#loading').show();
   var searchTerm = "<?php echo $search; ?>"; // This is what I've tried.
 $.ajax({
     url:"scroll.php",
              type:"POST",
              data:"actionfunction=showData&page=1&search="+searchTerm, // This is what I've tried.
    cache: false,
    success: function(response){
       $('#loading').hide();
      $('#demoajax').html(response);

    }

   });
$(window).scroll(function(){

   var height = $('#demoajax').height();
   var scroll_top = $(this).scrollTop();
   if(ajax_arry.length>0){
   $('#loading').hide();
   for(var i=0;i<ajax_arry.length;i++){
     ajax_arry[i].abort();
   }
}
   var page = $('#demoajax').find('.nextpage').val();
   var isload = $('#demoajax').find('.isload').val();

     if ((($(window).scrollTop()+document.body.clientHeight)==$(window).height()) && isload=='true'){
       $('#loading').show();
   var ajaxreq = $.ajax({
     url:"scroll.php",
              type:"POST",
              data:"actionfunction=showData&page="+page,
    cache: false,
    success: function(response){
       $('#demoajax').find('.nextpage').remove();
       $('#demoajax').find('.isload').remove();
       $('#loading').hide();

      $('#demoajax').append(response);

    }

   });
   ajax_arry[ajax_index++]= ajaxreq;

   }
return false;

if($(window).scrollTop() == $(window).height()) {
   alert("bottom!");
}
});

});

But when I get search from data:"actionfunction=showData&page=1&search="+searchTerm on scroll.php to query it does not work.

function showData($data,$con,$limit){
$page = $data['page'];
if($page==1){
    $start = 0;
}
else{
    $start = ($page-1)*$limit;
}
$name = $data['search'];
$sql = "SELECT * FROM product WHERE p_name LIKE '%$name'";

you should include your Js code in your php file. Because you can not write php code in js file. while js code can be written in php.

So your code should be like.

<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
    <input type="text" name="search" id="search" autocomplete="off">
    <button type="submit" class="btn btn-primary">Search</button>
</form>

<?php if ($_POST) {
    $search = $_POST['search'];
    ?> 
    <script>
        var ajax_arry = [];
        var ajax_index = 0;
        var sctp = 100;
        $(function () {
            $('#loading').show();
            var searchTerm = "<?php echo $search; ?>"; // This is what I've tried.
            $.ajax({
                url: "scroll.php",
                type: "POST",
                data: "actionfunction=showData&page=1&search=" + searchTerm, // This is what I've tried.
                cache: false,
                success: function (response) {
                    $('#loading').hide();
                    $('#demoajax').html(response);

                }

            });
            $(window).scroll(function () {

                var height = $('#demoajax').height();
                var scroll_top = $(this).scrollTop();
                if (ajax_arry.length > 0) {
                    $('#loading').hide();
                    for (var i = 0; i < ajax_arry.length; i++) {
                        ajax_arry[i].abort();
                    }
                }
                var page = $('#demoajax').find('.nextpage').val();
                var isload = $('#demoajax').find('.isload').val();

                if ((($(window).scrollTop() + document.body.clientHeight) == $(window).height()) && isload == 'true') {
                    $('#loading').show();
                    var ajaxreq = $.ajax({
                        url: "scroll.php",
                        type: "POST",
                        data: "actionfunction=showData&page=" + page,
                        cache: false,
                        success: function (response) {
                            $('#demoajax').find('.nextpage').remove();
                            $('#demoajax').find('.isload').remove();
                            $('#loading').hide();

                            $('#demoajax').append(response);

                        }

                    });
                    ajax_arry[ajax_index++] = ajaxreq;

                }
                return false;

                if ($(window).scrollTop() == $(window).height()) {
                    alert("bottom!");
                }
            });

        });
    </script>

<?php } ?>

Explanation

You do not "store" PHP variables in javascript. PHP is server sided and javascript works on the client side. They have to communicate.

Solutions

  1. Create a hidden input with php that you can sleect with javascript <input type="hidden" name="Language" value="English" id="val1">

  2. Use ajax to make a call in javascript to the php file, make the php file return the desired value

  3. use embedded javascript inside the PHP file that will be served to the user. However I would not recommend that.