Still celebrating National IT Professionals Day with 3 months of free Premium Membership. Use Code ITDAY17

x
?
Solved

Update mysql table from jquery ui dialog in datable.net webpage

Posted on 2011-02-11
5
Medium Priority
?
364 Views
Last Modified: 2013-11-27
Hi ! and sorry for my english
I display projects informations in table with datable.net code  (see the code datable.php) -  No problem. When I click a row i obtain some details in a jquery ui dialog box (see the code edit.php) -  No problem. The edit.php page is load in dialog box with ajax sack plugin -  No problem. But if a use a update button from the form in dialog box it doesnt update the data into mysql table (php code with isset method) .

I think i have to use the jquery method something like
$.ajax({
  type: 'POST',
  url: url,
  data: data,
  success: success
  dataType: dataType
});
 inside my datable.php code but it doesnt work too

Please could you help me many tanks
WEBPAGE datable.php 

<?php
	header('Content-type: text/html; charset=iso-8859-1');
		$id = $_GET["id"];
?>	  	
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>
	<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8"-s />
		
		<title>DataTables example</title>
		<link rel="stylesheet" href="../_code%20datatable/_datatable%20css/demo_page.css" />
		<link rel="stylesheet" href="../_code%20datatable/_datatable%20css/demo_table.css" />
		<link rel="stylesheet" href="../_code%20datatable/_datatable%20css/demo_table-tools.css" />	
		<link rel="stylesheet" href="../_code jquery ui/_jquery ui css/jquery.ui.base.css">
	
		<script type="text/javascript" language="javascript" src="../_code%20global%20js/js-jquery-1.4.4.js"></script>
		<script type="text/javascript" language="javascript" src="../_code%20datatable/_datatable%20js/js-jquery-datatables-min.js"></script>
		<script type="text/javascript" language="javascript" src="../_code%20datatable/_datatable%20js/js-jquery-datatables-tools.js"></script>
		<script src="../_code global js/js-ajax-sack.js"></script>
		<script src="../_code jquery ui/_jquery ui exernal/jquery.bgiframe-2.1.2.js"></script>
		<script src="../_code jquery ui/_jquery ui js/jquery.ui.core.min.js"></script>
		<script src="../_code jquery ui/_jquery ui js/jquery.ui.widget.min.js"></script>
		<script src="../_code jquery ui/_jquery ui js/jquery.ui.mouse.min.js"></script>
		<script src="../_code jquery ui/_jquery ui js/jquery.ui.button.min.js"></script>
		<script src="../_code jquery ui/_jquery ui js/jquery.ui.dialog.min.js"></script>
		<script src="../_code jquery ui/_jquery ui js/jquery.ui.position.min.js"></script>
		<script src="../_code jquery ui/_jquery ui js/jquery.ui.resizable.min.js"></script>
		<script src="../_code jquery ui/_jquery ui js/jquery.ui.dragable.min.js"></script>
	
		<script type="text/javascript" charset="utf-8">
			var oTable;
			$(function(){$("#dialog:ui-dialog").dialog("destroy");
			$("#dialog-sublocalisation").dialog({autoOpen:false,height:300,width:350,modal:true,buttons:{"Update":function(){
					*// MISSING CODE //* $(this).dialog("close");
			},
			Cancel:function(){$(this).dialog("close");}},close:function(){allFields.val("").removeClass("ui-state-error");}});});

			$(document).ready(function(){
				oTable = $('#example').dataTable( {
					"sDom": 'T<"clear">lfrtip',"bProcessing": true,
					"bServerSide": true,
					"sAjaxSource": "projects-sublocation-table-code.php?id=<?php echo $id ?>",
							"fnDrawCallback": function(oSettings){$('#example tbody tr').each(function(){
							var iPos = oTable.fnGetPosition(this);$(this).click(function(){
							var url = "projects-sublocation-edit.php?subid="+oSettings.aoData[iPos]._aData[0];
							$("#dialog-sublocalisation").load(url,function(){$("#dialog-sublocalisation").dialog("open");});
							})
						})
					},
					"oTableTools": {"sSwfPath": "../_code datatable/_datatable swf/copy_cvs_xls_pdf.swf"}
				});
			});

		</script>
	</head>
	<body id="dt_example">
		<div id="container">
		<div id="dynamic">
			<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
				<thead>
					<tr>
						<th width="20%">A</th>
						<th width="25%">B</th>
						<th width="25%">C</th>
						<th width="25%">D</th>
						<th width="25%">E</th>
						<th width="25%">F</th>
						<th width="25%">G</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td colspan="5" class="dataTables_empty">Loading data from server</td>
					</tr>
				</tbody>
			</table>		
			</div>
		</div>		
		<div id="dialog-sublocalisation" title="sublocation"></div>
	</body>
</html>

WEBPAGE  edit.php

<?php
	header('Content-type: text/html; charset=iso-8859-1');
	require('../_code security/security-connect intranet.php');
		$dblink = mysql_connect($db_host, $db_user, $db_pass) or die("Impossible de se connecter au serveur.");
			mysql_select_db($db_database, $dblink) or die("Impossible de se connecter à la base de donnée.");
			  	$subid = $_GET["subid"];
					 	$sql = "SELECT tb_projects_sublocations.sublocation_id,tb_projects_sublocations.sublocation_project_id,tb_projects_sublocations.sublocation_zone,tb_projects_sublocations.sublocation_zone_ID,tb_projects_sublocations.sublocation_country,tb_projects_sublocations.sublocation_country_ID,tb_projects_sublocations.sublocation_admin1,tb_projects_sublocations.sublocation_admin1_ID,tb_projects_sublocations.sublocation_admin2,tb_projects_sublocations.sublocation_admin2_ID,tb_projects_sublocations.sublocation_city,tb_projects_sublocations.sublocation_lat,tb_projects_sublocations.sublocation_long,tb_projects_sublocations.sublocation_start,tb_projects_sublocations.sublocation_end,tb_projects_sublocations.sublocation_description,tb_projects_sublocations.sublocation_nbpersons,tb_projects.project_title FROM tb_projects LEFT JOIN tb_projects_sublocations ON tb_projects_sublocations.sublocation_project_id = tb_projects.project_dripe_id WHERE sublocation_id =".$subid;
					 	$query = mysql_query($sql) or die("Impossible d'exécuter la requête.");
						 	if($result = mysql_fetch_object($query)){
	?>			  	
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
	</head>		
	<body>		
		<form name="c" id="c" method="POST">
			<label class="label" for="project_title">Projet </label><input name="project_title" id="project_title" size="10" value="<?php echo($result->project_title);?>"><br>
			<label class="label" for="sublocation_project_id">Numéro de suivi DRIPE </label><input name="sublocation_project_id" id="sublocation_project_id" size="10" value="<?php echo($result->sublocation_project_id);?>"><br>
			<label class="label" for="sublocation_id">Numéro sub </label><input name="sublocation_id" id="sublocation_id" size="10" value="<?php echo($result->sublocation_id);?>"><br>
			<label class="label" for="sublocation_zone">Zone  </label><input name="sublocation_zone" id="sublocation_zone" size="10" value="<?php echo($result->sublocation_zone);?>"><br>
			<label class="label" for="sublocation_zone_ID">Zone ID </label><input name="sublocation_zone_ID" id="sublocation_zone_ID" size="10" value="<?php echo($result->sublocation_zone_ID);?>"><br>
			<label class="label" for="sublocation_country">Pays  </label><input name="sublocation_country" id="sublocation_country" size="10" value="<?php echo($result->sublocation_country);?>"><br>
			<label class="label" for="sublocation_country_ID">Pays ID  </label><input name="sublocation_country_ID" id="sublocation_country_ID" size="10" value="<?php echo($result->sublocation_country_ID);?>"><br>
			<label class="label" for="sublocation_admin1">Région [niveau administratif 1] </label><input name="sublocation_admin1" id="sublocation_admin1" size="10" value="<?php echo($result->sublocation_admin1);?>"><br>
			<label class="label" for="sublocation_admin1_ID">Région 1 ID </label><input name="sublocation_admin1_ID" id="sublocation_admin1_ID" size="10" value="<?php echo($result->sublocation_admin1_ID);?>"><br>
			<label class="label" for="sublocation_admin2">Région [niveau administratif 2] </label><input name="sublocation_admin2" id="sublocation_admin2" size="10" value="<?php echo($result->sublocation_admin2);?>"><br>
			<label class="label" for="sublocation_admin2_ID">Région 2 ID </label><input name="sublocation_admin2_ID" id="sublocation_admin2_ID" size="10" value="<?php echo($result->sublocation_admin2_ID);?>"><br>
			<label class="label" for="sublocation_city">Ville </label><input name="sublocation_city" id="sublocation_city" size="10" value="<?php echo($result->sublocation_city);?>"><br>
			<label class="label" for="sublocation_lat">Latitude  </label><input name="sublocation_lat" id="sublocation_lat" size="10" value="<?php echo($result->sublocation_lat);?>"><br>
			<label class="label" for="sublocation_long">Longitude  </label><input name="sublocation_long" id="sublocation_long" size="10" value="<?php echo($result->sublocation_long);?>"><br>
			<label class="label" for="sublocation_start">Début </label><input name="sublocation_start" id="sublocation_start" size="10" value="<?php echo($result->sublocation_start);?>"><br>
			<label class="label" for="sublocation_end">Fin </label><input name="sublocation_end" id="sublocation_end" size="10" value="<?php echo($result->sublocation_end);?>"><br>
			<label class="label" for="sublocation_description">Description </label><input name="sublocation_description" id="sublocation_description" size="10" value="<?php echo($result->sublocation_description);?>"><br>
			<label class="label" for="sublocation_nbpersons">nbpersons</label><input name="sublocation_nbpersons" id="sublocation_nbpersons" size="10" value="<?php echo($result->sublocation_nbpersons);?>"><br>

			<input type="submit" name="Update" value="Update"/>
		</form>
	</body>
/////////// When i click update from the form in dialog box it doesnt update data in myslq table ////////

<?php }
if(isset($_POST['Update'])){
$id =  $_POST["sublocation_id"];
$sublocation_project_id =  $_POST["sublocation_project_id"];
$sublocation_zone =  $_POST["sublocation_zone"];
$sublocation_zone_ID =  $_POST["sublocation_zone_ID"];
$sublocation_country =  $_POST["sublocation_country"];
$sublocation_country_ID =  $_POST["sublocation_country_ID"];
$sublocation_admin1 =  $_POST["sublocation_admin1"];
$sublocation_admin1_ID =  $_POST["sublocation_admin1_ID"];
$sublocation_admin2 =  $_POST["sublocation_admin2"];
$sublocation_admin2_ID =  $_POST["sublocation_admin2_ID"];
$sublocation_city =  $_POST["sublocation_city"];
$sublocation_lat =  $_POST["sublocation_lat"];
$sublocation_long =  $_POST["sublocation_long"];
$sublocation_start =  $_POST["sublocation_start"];
$sublocation_end =  $_POST["sublocation_end"];
$sublocation_description =  $_POST["sublocation_description"];
$sublocation_nbpersons =  $_POST["sublocation_nbpersons"];
$sql = "UPDATE tb_projects_sublocations SET sublocation_project_id='$sublocation_project_id',sublocation_zone='$sublocation_zone',sublocation_zone_ID='$sublocation_zone_ID',sublocation_country='$sublocation_country',sublocation_country_ID='$sublocation_country_ID',sublocation_admin1='$sublocation_admin1',sublocation_admin1_ID='$sublocation_admin1_ID',sublocation_admin2='$sublocation_admin2',sublocation_admin2_ID='$sublocation_admin2_ID',sublocation_city='$sublocation_city',sublocation_lat='$sublocation_lat',sublocation_long='$sublocation_long',sublocation_start='$sublocation_start',sublocation_end='$sublocation_end',sublocation_description='$sublocation_description',sublocation_nbpersons='$sublocation_nbpersons' WHERE sublocation_id =" .$id;
$query = mysql_query($sql) or die(mysql_error()) ;
}?>
</html>

Open in new window

0
Comment
Question by:any_
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
5 Comments
 
LVL 18

Expert Comment

by:Sudaraka Wijesinghe
ID: 34879038
Your form on edit.php seem to be posting to it self instead of to update.php
<form name="c" id="c" method="POST">

Try changing that to :
<form name="c" id="c" method="POST" action="update.php">
0
 

Author Comment

by:any_
ID: 34905950
Thank you for your anwser. It's working well, but what i would like to do is to use the ui.dialog update button (please have a look at the picture) and not have to put a php update button inside the page i'm loading inside the modal dialog

Thanks     update buttons
0
 
LVL 18

Accepted Solution

by:
Sudaraka Wijesinghe earned 500 total points
ID: 34913726
Try the following code in your update button
$("#dialog-sublocalisation").dialog({
	autoOpen:false,
	height:300,
	width:350,
	modal:true,
	buttons:{
		"Update":function(){
				$.post(
					$('form#c').attr('action'), //You can also hardcode 'update.php' here
					function(result, status, xhr){
						
						//Handle the result here
						
						//POST successfull
						$(this).dialog("close");
					},
				);
			},
		Cancel:function(){
			$(this).dialog("close");
			}
		},
	close:function(){
		allFields.val("").removeClass("ui-state-error");
		}
});

Open in new window

0
 
LVL 16

Expert Comment

by:CWS (haripriya)
ID: 39680208
This question has been classified as abandoned and is closed as part of the Cleanup Program. See the recommendation for more details.
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction HyperText Transfer Protocol (http://www.ietf.org/rfc/rfc2616.txt) or "HTTP" is the underpinning of internet communication.  As a teacher of web development I have heard many questions, mostly from my younger students who have come to t…
This article discusses how to create an extensible mechanism for linked drop downs.
The viewer will learn how to count occurrences of each item in an array.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

722 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question