Javascript Not Updating Database - php

I have a Edit Profile, for the user's profile. Well, The Javascript seems to be only getting the value of the Age's Form. The PHP File is getting the Age, but no others and it's not updating the database.
Javascript:
function UpdateProfile() {
var newage = $("#NewAge").val();
var newimage = $("#NewImage").val();
var newbio = $("#NewBio").val();
var dataString = 'newage=' + newage || 'newimage=' + newimage || 'newbio=' + newbio;
if (newbio.length , newage.length , newimage.length == 0) {
$('#Required').fadeIn(300);
$('#Mask').fadeIn(300);
} else {
$.ajax({
type: "POST",
url: "update_profile.php",
data: dataString,
cache: false,
success: function (UpdateProfile) {
$('#EditInfo').hide();
$("#UpdatedProfile").html(UpdateProfile);
$("#UpdatedProfile").fadeIn('slow');
$("#Age").html('Age: ' + newage);
$('#Image').html('<img src="' + newimage +'" width="150" height="100" />');
}
});
}
}
Here's The update_profile.php File:
<?php session_start() ?>
<?php include 'connect.php' ?>
<?php
$newimage = $_POST['newimage'];
$newbio = $_POST['newabout'];
$newage = $_POST['newage'];
$update = "UPDATE members SET bio=(".$newbio.") age=(".$newage.") image=(".$newimage.") WHERE id='".$id."'";
$res = mysql_query($update);
echo 'Success: Profile Updated!<br />';
echo $update . '<br />';
?>
HTML:
<input type="text" id="NewAge" value="<?php echo $age ?>" maxlength="2" />
<input type="text" id="NewImage" value="<?php echo $image ?>" maxlength="500" />
<textarea id="NewBio" style="width: 500; max-width: 500; height: 100; max-height: 150;"><?php echo $bio ?></textarea>
<input type="submit" value="Update Profile" onClick="UpdateProfile()" />
The Code The Update outputs is this:
Success: Profile Updated!
UPDATE members SET bio=() age=(18) image=() WHERE id='1'

Try this instead:
$.ajax({
...
data: { newimage: newimage,
newage: newage,
newbio: newbio }
...
});

Update this line:
$newbio = $_POST['newabout'];
to
$newbio = $_POST['newbio'];
And it should work.

Related

jQuery Ajax working for only first result in while loop

The loop works fine, it display what it supposed to do, but there is a mysql update button of which updates only the first row value displayed:
$(document).ready(function() {
$("#update").click(function() {
var fname = $("#fname").val();
var lname = $("#lname").val();
var recordId = $("#recordId").val();
$.ajax({
url: 'update.php',
method: 'POST',
async: true,
data: {
fname: fname,
lname: lname,
recordId: recordId
},
success: function(response) {
alert(response);
}
});
});
});
<?php
$conn = new mysqli('localhost', 'root', '123456', 'lc');
$sql = "SELECT * FROM lc where customer='souhail'";
$result = $conn->query($sql);
// while ( $row=mysqli_fetch_assoc($result)) {
while($row = $result->fetch_array()) {
echo 'LC ID :<input type="text" id="fname" value="'.$row['element_6'].'"><br>';
echo 'Status :<input type="text" id="lname" value="'.$row['element_101'].'"><br>';
$recordId = $row['lc_id'];
echo '<input id="recordId" name="recordId" value="' . $recordId . '" >';
?>
<button type="button" style="background-color:<?php
if($row['element_101'] == '1'){
echo '#0000FFF';
}elseif ($row['element_101'] == '2'){
echo '#ffff00';
}elseif ($row['element_101'] == '3'){
echo '#00FF00';
}elseif ($row['element_101'] == '4'){
echo '#ffffff';
}
//echo $row['element_101'];
?>;color:#000000" id="update">Go Forward ></button>
<br><br>
<?php
} ?>
You must have unique IDs but instead wrap each set in a container and access relative tags:
$(".update").on("click", function() {
var $container = $(this).closest(".container");
var fname = $container.find(".fname").val();
var lname = $container.find(".lname").val();
var recordId = $container.find(".recordId").val();
$.ajax({
url: 'update.php',
method: 'POST',
data: {
fname: fname,
lname: lname,
recordId: recordId
},
success: function(response) {
alert(response);
},
error: function(xhr, textStatus, error) {
alert(xhr.statusText);
console.log(textStatus);
console.log(error);
}
});
});
Php
while($row = $result->fetch_array()) {
echo '<div class="container">
echo 'LC ID :<input type="text" class="fname" value="'.$row['element_6'].'"><br>';
echo 'Status :<input type="text" class="lname" value="'.$row['element_101'].'"><br>'; $recordId = $row['lc_id'];
echo '<input class="recordId" name="recordId" value="' . $recordId . '">';
echo '<button type="button" clsss="update">Go Forward ></button>';
echo '/div>';
} ?>

To fetch value of particular textbox

Here, I am using session to store multiple textbox value.
But when I am going to fetch from session, I am getting the same value for all textbox which is in session.
My code:
if ($order_list) {
$i = $start +1;
foreach ($order_list as $row)
{
?>
<input type="text" name="<?php echo $row['id']; ?>" class="txt" autocomplete="off" id="txtid_<?php echo $row['id']; ?>" value="<?php if(isset($_SESSION['txtval'])) { echo $_SESSION['txtval'];} ?>">
<?php } ?>
In javascript:
$(document).on('blur','.txt',function(){
var myVar = $(this).val();
//alert(myVar);
$.ajax({
type: "GET",
url: "view_orders_checked_array.php",
data: {account: myVar, task: 'alltxt'},
async: false
});
});
In view_orders_checked_array.php :
$task = $_GET['task'];
if($task == "alltxt")
{
$_SESSION['txtval'] = $account;
}
Here, I am not getting the value of particular textbox. I am getting the value which I have last inserted.
Where I am going wrong?
Check below working code, if you just pass the id with your txtval and create session for each id key and value . Now when you print session array you will get all key values in session array. Please ask if difficult to understand.
Javascript
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<?php
session_start();
$_SESSION['txtval'] = '';
$order_list[0] = array('id'=>'1');
$order_list[1] = array('id'=>'2');
$order_list[2] = array('id'=>'3');
$order_list[3] = array('id'=>'4');
$start = '';
if ($order_list) {
$i = $start + 1;
foreach ($order_list as $row) {
?>
<input type="text" name="<?php echo $row['id']; ?>" class="txt" autocomplete="off"
id="txtid_<?php echo $row['id']; ?>" value="<?php if (isset($_SESSION['txtval'])) {
echo $_SESSION['txtval'];
} ?>">
<?php }
}?>
<script type="text/javascript">
$(document).on('blur','.txt',function(){
var myVar = $(this).val();
var myVarid = this.id;
$.ajax({
type: "GET",
url: "view_orders_checked_array.php",
data: {account: myVar, task: 'alltxt', id: myVarid },
async: false,
success:function(data){
console.log(data);
}
});
});
</script>
PHP file view_orders_checked_array.php
<?php
session_start();
$task = $_GET['task'];
if ($task == "alltxt") {
$_SESSION['txtval'][$_REQUEST['id']] = $_REQUEST['account'];
}
echo '<pre>';print_r($_SESSION['txtval'] );echo '</pre>';
die('Call');
you have to maintain array in session also so that you can do with the help of ids
var id=your loop id;
data: {account: myVar, task: 'alltxt',id:id },
and in your view_orders_checked_array page
$task = $_GET['task'];
$id=$_GET['id'];
if($task == "alltxt")
{
$_SESSION['txtval'][$id] = $account;
}
and in your code
<input type="text" name="<?php echo $row['id']; ?>" class="txt" autocomplete="off" id="txtid_<?php echo $row['id']; ?>" value="<?php if(isset($_SESSION['txtval'])) { echo $_SESSION['txtval'][$row['id']];} ?>">
i suggest you to use POST method for passing values
Problem is that you are putting the same value in all text fields
$_SESSION['txtval']
in your loop is always the same.
Edit
And also I think you getting same last inserted value because instead to store all text fields in array $_SESSION['txtval']['another_id_key'] you storing it in $_SESSION['txtval'] which is only one value

Filter Records based on combobox value php ajax

I want to display records based on the value of the combobox (dropdown list) using ajax. Display list of examinees based on the examdate. Help. I am a newbie in PHP and AJAX.
I want to display records based on the value of the combobox (dropdown list) using ajax. Display list of examinees based on the examdate. Help. I am a newbie in PHP and AJAX.
I want to display records based on the value of the combobox (dropdown list) using ajax. Display list of examinees based on the examdate. Help. I am a newbie in PHP and AJAX.
<?php
include 'configuration.php';
$queryselect = mysql_query("SELECT examdateno, examdate from tbl_examdate ORDER BY examdate DESC");
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="onclick edit jquery php, grid in php, onclick change text box in jquery, onclick edit table row, insert update delete using jquery ajax, simple php data grid" />
<meta name="description" content="This article is about simple grid system using PHP, jQuery. Insert a new record to the table using by normal Ajax PHP. It will show the editable textbox when user clicks on the label." />
<link rel="stylesheet" type="text/css" href="css/grid.css" />
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/component.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript">
$(function () {
// Function for load the grid
function LoadGrid(dte) {
var gridder = $('#as_gridder');
var UrlToPass = 'action=load';
var value = $('#examdate').val();
gridder.html('loading..');
$.ajax({
url: 'ajax.php',
type: 'POST',
data: UrlToPass,
success: function (responseText) {
gridder.html(responseText);
}
});
}
// Seperate Function for datepiker() to save the value
function ForDatePiker(ThisElement) {
ThisElement.prev('span').html(ThisElement.val()).prop('title', ThisElement.val());
var UrlToPass = 'action=update&value=' + ThisElement.val() + '&crypto=' + ThisElement.prop('name');
$.ajax({
url: 'ajax.php',
type: 'POST',
data: UrlToPass
});
}
LoadGrid(); // Load the grid on page loads
// Execute datepiker() for date fields
$("body").delegate("input[type=text].datepicker", "focusin", function () {
var ThisElement = $(this);
$(this).datepicker({
dateFormat: 'yy/mm/dd',
onSelect: function () {
setTimeout(ForDatePiker(ThisElement), 500);
}
});
});
// Show the text box on click
$('body').delegate('.editable', 'click', function () {
var ThisElement = $(this);
ThisElement.find('span').hide();
ThisElement.find('.gridder_input').show().focus();
});
// Pass and save the textbox values on blur function
$('body').delegate('.gridder_input', 'blur', function () {
var ThisElement = $(this);
ThisElement.hide();
ThisElement.prev('span').show().html($(this).val()).prop('title', $(this).val());
var UrlToPass = 'action=update&value=' + ThisElement.val() + '&crypto=' + ThisElement.prop('name');
if (ThisElement.hasClass('datepicker')) {
return false;
}
$.ajax({
url: 'ajax.php',
type: 'POST',
data: UrlToPass
});
});
// Same as the above blur() when user hits the 'Enter' key
$('body').delegate('.gridder_input', 'keypress', function (e) {
if (e.keyCode == '13') {
var ThisElement = $(this);
ThisElement.hide();
ThisElement.prev('span').show().html($(this).val()).prop('title', $(this).val());
var UrlToPass = 'action=update&value=' + ThisElement.val() + '&crypto=' + ThisElement.prop('name');
if (ThisElement.hasClass('datepicker')) {
return false;
}
$.ajax({
url: 'ajax.php',
type: 'POST',
data: UrlToPass
});
}
});
// Function for delete the record
$('body').delegate('.gridder_delete', 'click', function () {
var conf = confirm('Are you sure want to delete this record?');
if (!conf) {
return false;
}
var ThisElement = $(this);
var UrlToPass = 'action=delete&value=' + ThisElement.attr('href');
$.ajax({
url: 'ajax.php',
type: 'POST',
data: UrlToPass,
success: function () {
LoadGrid();
}
});
return false;
});
// Add new record
// Add new record when the table is empty
$('body').delegate('.gridder_insert', 'click', function () {
$('#norecords').hide();
$('#addnew').slideDown();
return false;
});
// Add new record when the table in non-empty
$('body').delegate('.gridder_addnew', 'click', function () {
$('html, body').animate({scrollTop: $('.as_gridder').offset().top}, 250); // Scroll to top gridder table
$('#addnew').slideDown();
return false;
});
// Cancel the insertion
$('body').delegate('.gridder_cancel', 'click', function () {
LoadGrid()
return false;
});
// For datepiker
$("body").delegate(".gridder_add.datepiker", "focusin", function () {
var ThisElement = $(this);
$(this).datepicker({
dateFormat: 'yy/mm/dd'
});
});
// Pass the values to ajax page to add the values
$('body').delegate('#gridder_addrecord', 'click', function () {
// Do insert vaidation here
if ($('#fname').val() == '') {
$('#fname').focus();
alert('Enter the First Name');
return false;
}
if ($('#lname').val() == '') {
$('#lname').focus();
alert('Enter the Last Name');
return false;
}
if ($('#age').val() == '') {
$('#age').focus();
alert('Enter the Age');
return false;
}
if ($('#profession').val() == '') {
$('#profession').focus();
alert('Select the Profession');
return false;
}
if ($('#date').val() == '') {
$('#date').focus();
alert('Select the Date');
return false;
}
// Pass the form data to the ajax page
var data = $('#gridder_addform').serialize();
$.ajax({
url: 'ajax.php',
type: 'POST',
data: data,
success: function () {
LoadGrid();
}
});
return false;
});
});
</script>
</head>
<body>
<header>
<img src="images/qes_logob.png" alt="logo">
<button class="hamburger">☰</button>
<button class="cross">˟</button>
</header>
<div class="menu">
<ul>
<a href="encodeinterview.php">
<li>Encode Grades</li>
</a>
<a href="viewinterview.php">
<li>View Grades</li>
</a>
<a href="../index.php">
<li>Logout</li>
</a>
</ul>
</div>
<script>
$(function () {
$(".cross").hide();
$(".menu").hide();
$(".hamburger").click(function () {
$(".menu").slideToggle("slow", function () {
$(".hamburger").hide();
$(".cross").show();
});
});
$(".cross").click(function () {
$(".menu").slideToggle("slow", function () {
$(".cross").hide();
$(".hamburger").show();
});
});
});
</script>
<form>
<h1>Exam Dates</>
<select name="examdate" id="examDate" onchange="LoadGrid(this.value)">
<option>Select Exam Date</option>
<?php
while ($row = mysql_fetch_array($queryselect)) {
echo "<option value={$row['examdateno']}>{$row['examdate']}</option>\n";
}
?>
</select>
</form>
<div class="as_wrapper">
<div class="as_grid_container">
<div class="as_gridder" id="as_gridder"></div> <!-- GRID LOADER -->
</div>
</div>
</body>
</html>
AJAX
<?php
include 'configuration.php';
include 'functions/functions.php';
$action = $_REQUEST['action'];
$q = intval($_POST['q']);
switch($action) {
case "load":
$query = mysql_query("select s.sno, s.fname, s.lname, s.examdate, s.interviewgrade, s.gwa from student s inner join tbl_examdate e on s.examdate=e.examdate where e.examdateno=$q");
$count = mysql_num_rows($query);
if($count > 0) {
while($fetch = mysql_fetch_array($query)) {
$record[] = $fetch;
}
}
$department = array('Software Architect', 'Inventor', 'Programmer', 'Entrepreneur');
?>
<table class="as_gridder_table">
<tr class="grid_header">
<td><div class="grid_heading">Sno</div></td>
<td><div class="grid_heading">First Name</div></td>
<td><div class="grid_heading">Last Name</div></td>
<td><div class="grid_heading">Age</div></td>
<td><div class="grid_heading">Profession</div></td>
<td><div class="grid_heading">Date</div></td>
<td><div class="grid_heading">Actions</div></td>
</tr>
<tr id="addnew">
<td> </td>
<td colspan="6">
<form id="gridder_addform" method="post">
<input type="hidden" name="action" value="addnew" />
<table width="100%">
<tr>
<td><input type="text" name="fname" id="fname" class="gridder_add" /></td>
<td><input type="text" name="lname" id="lname" class="gridder_add" /></td>
<td><input type="text" name="age" id="age" class="gridder_add" /></td>
<td><select name="profession" id="profession" class="gridder_add select">
<option value="">SELECT</option>
<?php foreach($department as $departments) { ?>
<option value="<?php echo $departments; ?>"><?php echo $departments; ?></option>
<?php } ?>
</select></td>
<td><input type="text" name="date" id="date" class="gridder_add datepiker" /></td>
<td>
<input type="submit" id="gridder_addrecord" value="" class="gridder_addrecord_button" title="Add" />
<img src="images/delete.png" alt="Cancel" title="Cancel" /></td>
</tr>
</table>
</form>
</tr>
<?php
if($count <= 0) {
?>
<tr id="norecords">
<td colspan="7" align="center">No records found <img src="images/insert.png" alt="Add New" title="Add New" /></td>
</tr>
<?php } else {
$i = 0;
foreach($record as $records) {
$i = $i + 1;
?>
<tr class="<?php if($i%2 == 0) { echo 'even'; } else { echo 'odd'; } ?>">
<td><div class="grid_content sno"><span><?php echo $i; ?></span></div></td>
<td><div class="grid_content editable"><span><?php echo $records['fname']; ?></span><input type="text" class="gridder_input" name="<?php echo encrypt("fname|".$records['id']); ?>" value="<?php echo $records['fname']; ?>" /></div></td>
<td><div class="grid_content editable"><span><?php echo $records['lname']; ?></span><input type="text" class="gridder_input" name="<?php echo encrypt("lname|".$records['id']); ?>" value="<?php echo $records['lname']; ?>" /></div></td>
<td><div class="grid_content editable"><span><?php echo $records['age']; ?></span><input type="text" class="gridder_input" name="<?php echo encrypt("age|".$records['id']); ?>" value="<?php echo $records['age']; ?>" /></div></td>
<td><div class="grid_content editable"><span><?php echo $records['profession']; ?></span>
<select class="gridder_input select" name="<?php echo encrypt("profession|".$records['id']); ?>">
<?php foreach($department as $departments) { ?>
<option value="<?php echo $departments; ?>" <?php if($departments == $records['profession']) { echo 'selected="selected"'; } ?>><?php echo $departments; ?></option>
<?php } ?>
</select>
</div></td>
<td><div class="grid_content editable"><span><?php echo date("Y/m/d", strtotime($records['posted_date'])); ?></span><input type="text" class="gridder_input datepicker" name="<?php echo encrypt("posted_date|".$records['id']); ?>" value="<?php echo date("Y/m/d", strtotime($records['posted_date'])); ?>" /></div></td>
<td>
<img src="images/insert.png" alt="Add New" title="Add New" />
<img src="images/delete.png" alt="Delete" title="Delete" /></td>
</tr>
<?php
}
}
?>
</table>
<?php
break;
case "addnew":
$fname = isset($_POST['fname']) ? mysql_real_escape_string($_POST['fname']) : '';
$lname = isset($_POST['lname']) ? mysql_real_escape_string($_POST['lname']) : '';
$age = isset($_POST['age']) ? mysql_real_escape_string($_POST['age']) : '';
$profession = isset($_POST['profession']) ? mysql_real_escape_string($_POST['profession']) : '';
$date = isset($_POST['date']) ? mysql_real_escape_string($_POST['date']) : '';
mysql_query("INSERT INTO `grid` (fname, lname, age, profession, posted_date) VALUES ('$fname', '$lname', '$age', '$profession', '$date')");
break;
case "update":
$value = $_POST['value'];
$crypto = decrypt($_POST['crypto']);
$explode = explode('|', $crypto);
$columnName = $explode[0];
$rowId = $explode[1];
if($columnName == 'posted_date') { // Check the column is 'date', if yes convert it to date format
$datevalue = $value;
$value = date('Y-m-d', strtotime($datevalue));
}
$query = mysql_query("UPDATE `grid` SET `$columnName` = '$value' WHERE id = '$rowId' ");
break;
case "delete":
$value = decrypt($_POST['value']);
$query = mysql_query("DELETE FROM `grid` WHERE id = '$value' ");
break;
}
?>
You are not passing exam date in your ajax, i e q, but you are using that in $_POST, so pass the value from ajax to your file.
function LoadGrid(dte) {
var gridder = $('#as_gridder');
var UrlToPass = 'action=load';
var value = $('#examdate').val();
gridder.html('loading..');
$.ajax({
url: 'ajax.php',
type: 'POST',
data: {action:"load",q:dte}, <----- this line.
success: function (responseText) {
gridder.html(responseText);
}
});
}

ajax - no transmission of data

I am a newbie on ajax. I spend hours with "try and error", but unfortunately without success.
I have a form:
<form id="upload" method="post" name="form">
<input class="datepicker" type="text" name="date" value="<?php echo $date_bes; ?>"/>
<input class="chk" name="chk" type="checkbox" value="<?php echo $id_submit; ?>"
<?php if($check == 1){ echo "checked"; }else{ echo "";} ?>/>
<textarea class="remark" name="remark" cols="30" rows="1"><?php echo $remark; ?> </textarea>
<input class="submit" type="image" src="save.jpg"></td>
</form>
Then I my ajax_script.js:
$(document).ready(function() {
$( "#upload" ).on("submit", function() {
var id = $('.chk').val();
var date = $('.datepicker').val();
var chk = $('.chk').prop('checked');
var remark = $('.remark').val();
$.ajax({
type: "POST",
url: "update.php",
data : "{'id':'" + id + "', 'date':'" + date + "', 'chk':'" + chk + "', 'remark':'" + remark + "'}",
success: function (data) {
if(data.success == true)
{
console.log('everything fine');
}
},
error: function(){
console.log('something bad happened');
}
});
});
});
and my update.php
<?php
$id = $_POST['id'];
$date = $_POST['date'];
$chk = $_POST['chk'];
if($chk == true){
$check = 1;
}else{
$check = 0;
}
$remark = $_POST['remark'];
$jahr = substr($date,6,4);
$mon = substr($date,3,2);
$tag = substr($date,0,2);
$date = $jahr.'-'.$mon.'-'.$tag;
echo $id ."<br>".$date."<br>".$chk."<br>".$remark;
require_once('config.php');
$link = mysqli_connect (
MYSQL_HOST,
MYSQL_BENUTZER,
MYSQL_KENNWORT,
MYSQL_DATENBANK
);
if(!$link){
die('Keine Verbindung möglich: ' .mysql_error());
}
$sql = "UPDATE mytable
SET date = '$date', chka ='$chk', remark = '$remark' WHERE id_submits = $id";
$result = mysqli_query( $link, $sql );
echo $sql."<br>";
?>
After push on the bottom, firebug deliver me following:
Can anybody help me - please!
Regards,
Yab86
I think that you do not really need the quotes around the variable in the data section of ajax.
data: {id: id, date: date, chk: chk, remark: remark},
To let AJAX pass data through JQuery you should simply put in the "data" part of the AJAX request your data in this format {'name':name_on_php,'name2':name_on_php2}
I've written "name_on_php" to remind you that the part after the " : " is the one that you GET or POST on your php page.
Hope it helped :)

Problem with Mootools Ajax request and submitting a form

I have a table with content comming from a database. Now i tryed to realize a way to (a) delete rows from the table (b) edit the content of the row "on the fly". (a) is working perfectly (b) makes my head smoking!
Here is the complete Mootools Code:
<script type="text/javascript">
window.addEvent('domready', function() {
var eDit = $('edit_hide');
eDit.slide('hide');
var del = new Request.HTML(
{
url: 'fuss_response.php',
encoding: 'utf-8',
update: eDit,
onComplete: function(response)
{
eDit.slide('in');
}
});
$$('input.delete').addEvent( 'click', function(e){
e.stop();
var aID = 'delete_', bID = '';
var deleteID = this.getProperty('id').replace(aID,bID);
new MooDialog.Confirm('Soll der Termin gelöscht werden?', function(){
del.send({data : "id=" + deleteID});
}, function(){
new MooDialog.Alert('Schon Konfuzius hat gesagt: Erst denken dann handeln!');
});
});
var edit = new Request.HTML(
{
url: 'fuss_response_edit.php',
update: eDit,
encoding: 'utf-8',
onComplete: function(response)
{
$('sst').addEvent( 'click', function(e){
e.stop();
safe.send();
});
}
});
var safe = new Request.HTML(
{
url: 'termin_safe.php',
encoding: 'utf-8',
update: eDit,
onComplete: function(response)
{
}
});
$$('input.edit').addEvent( 'click', function(e){
e.stop();
var aID = 'edit_', bID = '';
var editID = this.getProperty('id').replace(aID,bID);
edit.send({data : "id=" + editID});
$('edit_hide').slide('toggle');
});
});
</script>
Here the PHP Part that makes the Edit Form:
<?php
$cKey = mysql_real_escape_string($_POST['id']);
$request = mysql_query("SELECT * FROM fusspflege WHERE ID = '".$cKey."'");
while ($row = mysql_fetch_object($request))
{
$id = $row->ID;
$name = $row->name;
$vor = $row->vorname;
$ort = $row->ort;
$tel = $row->telefon;
$mail = $row->email;
}
echo '<form id="termin_edit" method="post" action="">';
echo '<div><label>Name:</label><input type="text" id="nns" name="name" value="'.$name.'"></div>';
echo '<div><label>Vorname:</label><input type="text" id="nvs" name="vorname" value="'.$vor.'"></div>';
echo '<div><label>Ort:</label><input type="text" id="nos" name="ort" value="'.$ort.'"></div>';
echo '<div><label>Telefon:</label><input type="text" id="nts" name="telefon" value="'.$tel.'"></div>';
echo '<div><label>eMail:</label><input type="text" id="nms" name="email" value="'.$mail.'"></div>';
echo '<input name="id" type="hidden" id="ids" value="'.$id.'"/>';
echo '<input type="button" id="sst" value="Speichern">';
echo '</form>';
?>
And last the Code of the termin_safe.php
$id = mysql_real_escape_string($_POST['id']);
$na = mysql_real_escape_string($_POST['name']);
$vn = mysql_real_escape_string($_POST['vorname']);
$ort = mysql_real_escape_string($_POST['ort']);
$tel = mysql_real_escape_string($_POST['telefon']);
$em = mysql_real_escape_string($_POST['email']);
$score = mysql_query("UPDATE fuspflege SET name = '".$na."', vorname = '".$vn."', ort = '".$ort."', telefon = '".$tel."', email = '".$em."' WHERE ID = '".$id."'");
As far as i can see the request does work but the data is not updated! i guess somethings wrong with the things posted
For any suggestions i will be gladly happy!
PS after some comments: I see the problem in this part:
var edit = new Request.HTML(
{
url: 'fuss_response_edit.php',
update: eDit,
encoding: 'utf-8',
onComplete: function(response)
{
$('sst').addEvent( 'click', function(e){
e.stop();
safe.send();
});
}
});
The "Edit" request opens the form with the prefilled input fields and then attaches a click event to the submit button which should call a new request when clicked.
This third request i fail to pass the data of the input fields. i tried to get the value of each field like this:
var name = $('nns').getProperty('value');
and pass it this way
.send({data : "name=" + name});
did not work so far
PPS:
as requested the code that makes the html from main site
<?php $request = mysql_query("SELECT * FROM fusspflege");
echo '<form id="fusspflege" method="post" action="">';
echo '<table class="fuss_admin">';
echo '<tr><th>Name</th><th>Vorname</th><th>Ort</th><th>Telefon</th><th>eMail</th><th>Uhrzeit</th><th>Datum</th><th></th><th></th></tr>';
echo '<tr><td colspan=8 id="upd"></td></tr>';
while ($row = mysql_fetch_object($request))
{
$id = $row->ID;
$name = $row->name;
$vor = $row->vorname;
$ort = $row->ort;
$tel = $row->telefon;
$mail = $row->email;
$dat = $row->datum;
$uhr = $row->uhrzeit;
echo '<tr><td>'.$name.'</td><td>'.$vor.'</td><td>'.$ort.'</td><td>'.$tel.'</td><td>'.$mail.'</td><td>'.$uhr.'</td><td>'.$dat.'</td>';
echo '<td><input id="delete_'.$id.'" class="delete" type="button" value="X"></td>';
echo '<td><input id="edit_'.$id.'" class="edit" type="button" value="?"></td>';
echo '</tr>';
}
echo '</table>';
echo '</form>';
echo '<div id="edit_hide"></div>';
?>
UPDATE:
<form action="" method="post" id="termin_edit">
<div>
<label>
Name:
</label>
<input type="text" value="NAME" name="name" id="nns">
</div>
<div>
<label>
Vorname:
</label>
<input type="text" value="Marianne" name="vorname" id="nvs">
</div>
<div>
<label>
Ort:
</label>
<input type="text" value="MArkt Wald" name="ort" id="nos">
</div>
<div>
<label>
Telefon:
</label>
<input type="text" value="" name="telefon" id="nts">
</div>
<div>
<label>
eMail:
</label>
<input type="text" value="info#rudolfapotheke.de" name="email" id="nms">
</div>
<input type="hidden" value="115" id="ids" name="id">
<input type="button" value="Speichern" id="sst">
</form>
Update:
This is the mootools script based on the form you gave me that should work with your html:
$('sst').addEvent('click', function(event) {
var data;
event.stop();
var myInputEl = $$('#termin_edit input');
for(var i=0; i<myInputEl.length; i++){
if(i == 0)
data = myInputEl[i].name + "=" + myInputEl[i].value;
else
data += "&" + myInputEl[i].name + "=" + myInputEl[i].value;
}
myRequest.send(data);
});
Also add alert to your Request call back for the edit just to test if the ajax worked:
onSuccess: function(responseText) {
alert("done! " + responseText);
},
onFailure: function() {
alert("failed");
}
On the php side create a new PHP file and put the following in it and have ajax target it:
<?php
print_r($_POST);
?>
The Ajax should return the $_POST array in the alert box.

Categories