Сохранение данных в базу данных с помощью JQuery

Question

Я создаю браузерную ролевую игру. Я хочу, чтобы пользователь мог сохранить их текущую статистику, обновив mysql db, не перезагружая страницу ... Поэтому я думал, что jquery может помочь.

Пользователь не будет добавлять свою статистику. Статистика генерируется посредством действий пользователя, таких как решение проблемы. Я хочу, чтобы пользователь мог сохранять эти обновленные данные в базу данных всякий раз, когда захочет.

Вопросы являются:

• JQuery выводит на echo "saved..." . $stats . ", " . $stats2;, прежде чем нажать на кнопку Сохранить.

• Когда я нажимаю кнопку «Сохранить», поле базы данных не обновляется.

Мне интересно, почему это не работает. Когда я нажимаю save, поля статистики не должны быть 0, но должны отображаться статистические данные - 11. Поля базы данных также должны быть обновлены.

Для целей тестирования я только что создал переменную js var stats, которая обновляется при нажатии клавиш со стрелками.

Я вызываю функцию updateHUD(), чтобы сделать $('#stats').html(stats);, которая обновляет HTML.

function updateHUD() { 
    $('#stats').html(stats); 
} 

Затем вызывается updateHUD после нажатия клавиши со стрелкой.

---

HTML

<div class="span12"> 
    <button onclick="saveData(stats)" name="input" value="">Save Data</button> 
     <br /><span id="output"></span><br /> 
     <ul> 
     <li><b>Stats 1:</b>  <span id="stats"></span> </li> 
     </ul> 
</div> 

---

JQuery

//Pass saved data to store in DB 
$(document).ready(function() { 
    saveData(); 
}); 


function saveData() {  
    $.get("php/CRUD.php", {"_input" : $('input[name=input]').val()}, 
     function(returned_data) { 
      $("#output").html(returned_data); 
     } 
    ); 
} 

---

PHP

<?php 
//store all player data in array and save to/update db 
include 'DbConnect.php'; 
session_start(); 

$stats = (isset($_GET['_input']) ? ($_GET['_input']) : 0); 

$formvars = array(); 
array_push($formvars, $stats);  

echo $stats; 
echo $_SESSION['username']; 


$qry = 'UPDATE users SET stats="'.$stats.'" WHERE username="' . $_SESSION['username'] . '"';  
$mysqli->query($qry) or die(mysqli_error($mysqli)); 

echo "saved..." . $stats; 
mysqli_close($mysqli); 
?> 

---

Выход

saved...0 //this should be 11 
Stats 1: 11 

Answer 1

Вы сделать

$('input[name=input]').val()

но вы назвали кнопку отправить "вход" вместо добавления поле ввода с это имя.

Но вопрос в любом случае неясен.

Вы хотите дать пользователю разрешение на обновление своего stat так, чтобы он хотел? Вы должны обновить вопрос, чтобы сделать его более понятным, поскольку в настоящий момент это не имеет особого смысла.

Answer 2

Также вы можете попробовать использовать load:

//Pass saved data to store in DB 
$(document).ready(function() { 
    saveData(); 
}); 


$.fn.saveData=function(){ 
    $('#divforload').css('display','none'); 
    $('#divforload').load("php/CRUD.php?stats="+$('#stats').val(),function(){$('#divforload').fadeIn();}); 
} 
//Just call the function onClick... 
//Need an input called 'stats' 
}); 

Answer 3

Сначала ваш селектор, где вы получаете ваши данные от неверен. Вам нужно либо изменить HTML ...

<button name="input"></button> 

Ань ...

<input type="button" name="input" /> 

или изменить селектор JQuery ...

$('input[name=input]') 

выбрать правильный элемент

$('button[name=input]') 

Во-вторых, вам нужно убедиться, что у вашей кнопки «значение =» «» есть данные в ней при вызове функции ajax.

<button onclick="saveData(stats)" name="input" value="[Data Value Goes Here]">Save Data</button> 

Наконец, причина ваш Jquery выводит перед вами нажмите на кнопку сохранить, потому что вы выполняете функцию как только загрузки документа.

$(document).ready(function() { 
    saveData(); 
}); 

Попробуйте что-то больше, как это:

HTML

<button name="input" value="[data goes here]">Save Data</button> 

JavaScript/JQuery

//Pass saved data to store in DB 
$('button[name=input]').on('click', saveData); 


function saveData() {  
    $.get("php/CRUD.php", {"_input" : $(this).val()}, 
     function(returned_data) { 
      $("#output").html(returned_data); 
     } 
    ); 
}