rearrange tables outputs xml file CMS

**ggalan** · 03-20-2011, 05:34 PM

i am trying to make a simple cms that outputs a xml file after rearranging tables
you can see the string output from $("p.output").html( $.tableDnD.serialize()

;
but i dont know where to start so that php can translate this into a xml output

working files: http://www.2020proj.com/upload/files..._dragNdrop.zip

Code:

<head>
<link type="text/css" href="isocra.css" rel="stylesheet" media="all"/>
<link rel="stylesheet" href="http://www.isocra.com/wp-content/themes/isocra/style.css" type="text/css" media="screen" />

<script src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script src="jquery.tablednd_0_5.js"></script>


<script type="text/javascript">
$(document).ready(function() {

	$('#table-3').tableDnD({
        onDrop: function(table, row) {
		
			var str = $.tableDnD.serialize();
			$("p.output").html(str);// <-- it outputs the re-arrangement here but how can i translate this so that php outputs a xml file?
			
            //alert($.tableDnD.serialize());
            //document.write($.tableDnD.serialize());
        }
    });

});

</script>

</head>
<body>
	
<div class="tableDemo">
	
	<div id="AjaxResult" style="float: right; width: 400px; border: 1px solid silver; padding: 4px; font-size: 90%">
	<h3>Ajax result</h3>
	<p>Drag and drop in this table to test out serialise and using JQuery.load()</p>
	<p class="output"></p>
	</div>

<table id="table-3" cellspacing="0" cellpadding="2">
	<tr id="3.1">
		<td>1</td>
		<td>One</td>
		<td><input type="text" name="one" value="one"/></td>
	</tr>
	<tr id="3.2">
		<td>2</td>
		<td>Two</td>
		<td><input type="text" name="two" value="two"/></td>
	</tr>
	<tr id="3.3" class="nodrop">
		<td>3</td>
		<td>Three (Can’t drop on this row)</td>
		<td><input type="text" name="three" value="three"/></td>
	</tr>
	<tr id="3.4">
		<td>4</td>
		<td>Four</td>
		<td><input type="text" name="four" value="four"/></td>
	</tr>
	<tr id="3.5" class="nodrag">
		<td>5</td>
		<td>Five (Can’t drag this row)</td>
		<td><input type="text" name="five" value="five"/></td>
	</tr>
	<tr id="3.6">
		<td>6</td>
		<td>Six</td>
		<td><input type="text" name="six" value="six"/></td>
	</tr>
</table>

</div>


</body>

**ggalan** · 03-20-2011, 09:55 PM

heres a better example

PHP Code:


<head>

<link type="text/css" href="isocra.css" rel="stylesheet" media="all"/>

<link rel="stylesheet" href="http://www.isocra.com/wp-content/themes/isocra/style.css" type="text/css" media="screen" />



<script src="http://code.jquery.com/jquery-1.5.min.js"></script>

<script src="jquery.tablednd_0_5.js"></script>





<script type="text/javascript">

$(document).ready(function() {



    $('#table-3').tableDnD({

        onDrop: function(table, row) {

        

            var str = $.tableDnD.serialize();

            $("p.output").html(str);

            

            //alert($.tableDnD.serialize());

           //document.write($.tableDnD.serialize());

        }

    });



});



</script>



</head>

<body>

    

<div class="tableDemo">

    

    <div id="AjaxResult" style="float: right; width: 400px; border: 1px solid silver; padding: 4px; font-size: 90%">

    <h3>Ajax result</h3>

    <p>Drag and drop in this table to test out serialise and using JQuery.load()</p>

    <p class="output"></p>

    </div>



<table id="table-3" cellspacing="0" cellpadding="2">

<?php 

$doc = new DOMDocument(); 

$doc->load( 'employees.xml' ); 

$num = 0; 

$employees = $doc->getElementsByTagName( "employee" ); 

foreach( $employees as $employee ) 

{ 

  $names = $employee->getElementsByTagName( "name" ); 

  $name = $names->item(0)->nodeValue; 

   

  $ages= $employee->getElementsByTagName( "age" ); 

  $age= $ages->item(0)->nodeValue; 

   

  $salaries = $employee->getElementsByTagName( "salary" ); 

  $salary = $salaries->item(0)->nodeValue; 

   

  //echo "<b>$name - $age - $salary\n</b><br/>"; 

  echo "<tr id='$num'>\n";

  echo "<td>$name</td>\n"; 

  echo "<td>$age</td>\n"; 

  echo "<td>$salary</td>\n";

  echo "</tr>\n";

  $num++;

} 

?>

</table>



</div>





</body>

and xml

Code:

<?xml version="1.0" encoding="iso-8859-1"?>
<Resources>
	<employee>
		<name>Mark</name>
		<age>27</age>
		<salary>$5000</salary>
	</employee>
	<employee>
		<name>Jack</name>
		<age>25</age>
		<salary>$4000</salary>
	</employee>
	<employee>
		<name>Frank</name>
		<age>31</age>
		<salary>$2600</salary>
	</employee>
	<employee>
		<name>Bill</name>
		<age>60</age>
		<salary>$1300</salary>
	</employee>
	<employee>
		<name>Eric</name>
		<age>26</age>
		<salary>$85000</salary>
	</employee>
	<employee>
		<name>Nate</name>
		<age>25</age>
		<salary>$600</salary>
	</employee>
</Resources>

**ggalan** · 03-29-2011, 11:17 PM

anyone?

Thread: rearrange tables outputs xml file CMS

Thread Tools

Search Thread

rearrange tables outputs xml file CMS

Bookmarks

Bookmarks

Posting Permissions