堆棧內存溢出
  簡體   English   中英

AJAX 變量傳遞給 SQL 但不傳遞給 PHP

[英]AJAX variable passes through to SQL but not PHP

 原文  2020-03-22 08:24:43  5   2    javascript/ php/ sql/ ajax

問題描述

我是 AJAX 的新手，我非常感謝您就此提出任何建議。

在一個文件中，我有以下 AJAX 代碼：

        <meta charset="UTF-8">
      <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
      <script>


      var dyna = <?php echo $user_dyna; ?>;
      var limit = <?php echo $limit; ?>

      $(function() {

      $(".numbers-row").append('<div class="inc button" display:inline-block>+</div><div class="dec button">-</div>');

      $(".button").on("click", function() {

        var $button = $(this);
        var oldValue = $button.parent().find("input").val();

        if ($button.text() == "+") {
        if (dyna > 0) {
          var newVal = parseFloat(oldValue) + 5;
          dyna -= 5;
        }
        else {
            newVal = oldValue;
        }
        } else {
           // Don't allow decrementing below zero
          if (oldValue > 0) {
            var newVal = parseFloat(oldValue) - 5;
            dyna += 5;
            } else {
            newVal = 0;
          }
          }

        if (dyna >= 0) {var dynatxt = dyna;}
        else {var dynatxt = 'Insufficient';}

        $button.parent().find("input").val(newVal);

        var InstAtk = parseFloat(document.getElementById('atk').value);
        var InstDef = parseFloat(document.getElementById('def').value);
        var InstHP = parseFloat(document.getElementById('hp').value);
        var sum = InstAtk + InstDef + InstHP

        document.getElementById('dynacandy').innerHTML = '<b>Dyna Candies Remaining: ' + dynatxt + '</b>';

        if (sum > limit) {
        document.getElementById('limit').innerHTML = '<br><font color = "yellow">Stat total (' + sum + ') exceeds your limit of ' + limit + '</font><br>';
        }
        else {
        document.getElementById('limit').innerHTML = '';
        }
      });


        $(document).ready(function() {  
            $("form").submit(function(event) {

            var Atk = document.getElementById('atk').value;
            var Def = document.getElementById('def').value;
            var HP = document.getElementById('hp').value;
            console.log(dyna);
            $.ajax({
            url: 'titan_ajax.php',
            type: 'POST',
            data: {dyna: dyna, Atk: Atk, Def: Def, HP: HP},
            success: function(res){
                        console.log(res);
                        //alert('The server returned ' + res);
                    }

            });
            });
        });

    });
      </script>

</head>

<body>
    <center>
    <div class="titan">
    <form method="post" action="titan_ajax.php">
     <div class="numbers-row">
         &nbsp;&nbsp;&nbsp;<label for="name">Dyna HP</label>
        <input type='number' name="hp" id="hp" value="<?=$titan['titan_hp']?>">
      </div>
     <div class="numbers-row">
        &nbsp;&nbsp;&nbsp; <label for="name">Dyna Attack</label>
        <input type="number" name="atk" id="atk" value="<?=$titan['titan_atk']?>">
      </div>
   <div class="numbers-row">
           &nbsp;&nbsp;&nbsp;&nbsp<label for="name">Dyna Defense</label>
        <input type="number" name="def" id="def" value="<?=$titan['titan_def']?>">
      </div>
      <br>
    <input type = "submit" button class = "global-btn" value="Submit">
    <br/>
    <br/>
    <span id="dynacandy"></span>
    <span id="limit"></span>
    <br>
    </form>
    </div>
    </center>
</body>

</html>

在我的 ajax 文件中，我有：

if (isset($_POST['dyna'])) {
    $newdyna = $_POST['dyna'];
    $newAtk = $_POST['Atk'];
    $newDef = $_POST['Def'];
    $newHP = $_POST['HP'];

    if ($newdyna < 0) {
        echo $newdyna;
        echo 'error';
    }
    else {
        $mysqli->query("UPDATE user_items SET dyna_candy = {$newdyna} WHERE uid = {$uid}");
    }
}

我得到的奇怪錯誤是 - SQL 工作得很好 - 我已經測試了十幾次。 但是，我永遠無法得到 PHP 變量 $newdyna 的回顯，也不會在 $newdyna 低於零時顯示文本“錯誤”。 每當 $newdyna < 0 時，我得到的只是一個空白屏幕。

我在這里做錯了什么？

2 個解決方案

解決方案1
 1  2020-03-22 13:56:05

您的 ajax 無法正常工作我將您的代碼移動到一個新函數sendToServer嘗試下面的 HTML 代碼...

<html>
<meta charset="UTF-8">
      <script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
      <script>


      var dyna = <?php $user_dyna=1; echo $user_dyna; ?>;
      var limit = <?php $limit=1; echo $limit; ?>;  

      $(function() {

          $(".numbers-row").append('<div class="inc button" display:inline-block>+</div><div class="dec button">-</div>');

          $(".button").on("click", function() {

            var $button = $(this);
            var oldValue = $button.parent().find("input").val();

            if ($button.text() == "+") {
            if (dyna > 0) {
              var newVal = parseFloat(oldValue) + 5;
              dyna -= 5;
            }
            else {
                newVal = oldValue;
            }
            } else {
               // Don't allow decrementing below zero
              if (oldValue > 0) {
                var newVal = parseFloat(oldValue) - 5;
                dyna += 5;
                } else {
                newVal = 0;
              }
              }

            if (dyna >= 0) {var dynatxt = dyna;}
            else {var dynatxt = 'Insufficient';}

            $button.parent().find("input").val(newVal);

            var InstAtk = parseFloat(document.getElementById('atk').value);
            var InstDef = parseFloat(document.getElementById('def').value);
            var InstHP = parseFloat(document.getElementById('hp').value);
            var sum = InstAtk + InstDef + InstHP

            document.getElementById('dynacandy').innerHTML = '<b>Dyna Candies Remaining: ' + dynatxt + '</b>';

            if (sum > limit) {
                document.getElementById('limit').innerHTML = '<br><font color = "yellow">Stat total (' + sum + ') exceeds your limit of ' + limit + '</font><br>';
            }
            else {
                document.getElementById('limit').innerHTML = '';
            }
      });

    });



    function sendToServer() {
        var Atk = document.getElementById('atk').value;
        var Def = document.getElementById('def').value;
        var HP = document.getElementById('hp').value;
        console.log(dyna);
        $.ajax({
            url: 'titan_ajax.php',
            type: 'POST',
            data: {dyna: dyna, Atk: Atk, Def: Def, HP: HP},
            success: function(res){
                alert('success');
                console.log(res);
            },   
             error: function (jqXHR, exception) {
                var msg = '';
                if (jqXHR.status === 0) {
                    msg = 'Not connect.\n Verify Network.';
                } else if (jqXHR.status == 404) {
                    msg = 'Requested page not found. [404]';
                } else if (jqXHR.status == 500) {
                    msg = 'Internal Server Error [500].';
                } else if (exception === 'parsererror') {
                    msg = 'Requested JSON parse failed.';
                } else if (exception === 'timeout') {
                    msg = 'Time out error.';
                } else if (exception === 'abort') {
                    msg = 'Ajax request aborted.';
                } else {
                    msg = 'Uncaught Error.\n' + jqXHR.responseText;
                }
                alert(msg);
            }

        });
        return false;
    }
</script>

</head>

<body>
    <center>
    <div class="titan">
    <form method="post" onsubmit="sendToServer();">
         <div class="numbers-row">
             &nbsp;&nbsp;&nbsp;<label for="name">Dyna HP</label>
            <input type='number' name="hp" id="hp" value="<?=$titan['titan_hp']?>">
          </div>
         <div class="numbers-row">
            &nbsp;&nbsp;&nbsp; <label for="name">Dyna Attack</label>
            <input type="number" name="atk" id="atk" value="<?=$titan['titan_atk']?>">
          </div>
       <div class="numbers-row">
               &nbsp;&nbsp;&nbsp;&nbsp<label for="name">Dyna Defense</label>
            <input type="number" name="def" id="def" value="<?=$titan['titan_def']?>">
          </div>
          <br>
        <input type = "submit" button class = "global-btn" value="Submit">
        <br/>
        <br/>
        <span id="dynacandy"></span>
        <span id="limit"></span>
        <br>
    </form>
    </div>
    </center>
</body>

</html>

解決方案2
 0  2020-03-24 02:15:18

通過添加到 Ronak 的原始 sendtoServer() 函數，我設法找到了解決我的問題的方法。 此方法不涉及頁面重定向，但仍顯示在我的titan_ajax.php 中回顯的成功/錯誤消息。

function sendToServer() {
    event.preventDefault();

    console.log(change);
    console.log(dyna);

    $.ajax({
        url: 'titan_ajax.php',
        type: 'POST',
         data: {dyna: dyna, Atk: Atk, Def: Def, HP: HP},
        success: function(res){
            console.log(res);
        }   

    });

        $(".form-message").load("titan_ajax.php", {
        dyna: dyna,
        Atk: Atk,
        Def: Def,
        HP: HP,
        });
        return false;
    }

在我的 html 中，我添加了以下標簽來顯示來自“titan_ajax.php”的回聲：

<p class="form-message"></p>

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 如何使用php變量通過Ajax從sql加載數據？ PHP變量通過Ajax傳遞 通過AJAX將JavaScript變量傳遞給PHP 無法通過ajax將javascript變量傳遞給PHP？ 通過AJAX發送PHP變量值 變量不使用ajax通過php頁面傳遞 PHP會話變量不通過AJAX調用持久化 變量未通過 ajax 從 javascript 傳遞到 php 通過AJAX將變量從JavaScript傳遞給PHP 通過AJAX將會話變量傳遞給PHP文件
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM