2013-06-22 18 views
10

Próbuję zapisać kolejność tabel z jQuery UI (sortable) do tablicy PHP.jQuery UI zapisywanie listy sortowalnej do tablicy PHP

Uprościliśmy to bardzo znacząco, ale jest to podstawowa idea. Mam tabelę z wbudowaną listą do sortowania. Tabela jest generowana przez PHP foreach z udziałem wielowymiarowej tablicy zawartej w innym pliku (config.php).

config.php:

<?php 
$config  = array(
    "mno" => array('item 5'), 
    "abc" => array('item 1'), 
    "ghi" => array('item 3'), 
    "pqr" => array('item 6'), 
    "jkl" => array('item 4'), 
    "vwx" => array('item 8'), 
    "def" => array('item 2'), 
    "stu" => array('item 7'), 
); 
?> 

stół (index.html)

<table cellpadding="2" cellspacing="0" align="center" id="mytable"> 
    <tbody> 
<?php 
    $i = 0; 
    include 'config.php'; 
    foreach($config AS $name => $value){ 
     $item = $value[0]; 
     echo ' 
     <tr id="'.$name.'-'.$i++.'"> 
      <td>'.$item.'</td> 
     </tr>'; 
    } 
?> 
</tbody> 
</table> 

skrypty (index.html):

<!-- Add jQuery library --> 
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
<!-- Add jQuery UI library --> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     var fixHelper = function(e, ui) { 
      ui.children().each(function() { 
       $(this).width($(this).width()); 
      }); 
      return ui; 
     }; 

     $("#mytable tbody").sortable({ 
      helper: fixHelper, 
      opacity: 0.5, 
      scroll: false, 
      update: function() { 
       var data = $('#mytable tbody').sortable('serialize'); 
       $.post("edit.php", {'neworder': data}); 
      } 
     }).disableSelection(); 
    }); 
</script> 

Sortowanie działa dobrze, ale nie wiem jak zapisać wartość neworder ($_POST['neworder']) do tablicy, co jest w config.php.

myślę, muszę korzystać z funkcji PHP uasort() (lub uksort(), uksort()) z kombinacji file_put_contents aby zapisać nową kolejność config.php.

Więc coś takiego:.

<?php 
if($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['neworder'])) { 
    /* 
    Here file_put_contents in config.php the new order. So: 
    $config  = array(
     "mno" => array('item 5'), 
     "abc" => array('item 1'), 
     "ghi" => array('item 3'), 
     "pqr" => array('item 6'), 
     "jkl" => array('item 4'), 
     "vwx" => array('item 8'), 
     "def" => array('item 2'), 
     "stu" => array('item 7'), 
    ); 

    Becomes: 
    $config  = array(
     "abc" => array('item 1'), 
     "def" => array('item 2'), 
     "ghi" => array('item 3'), 
     "jkl" => array('item 4'), 
     "mno" => array('item 5'), 
     "pqr" => array('item 6'), 
     "stu" => array('item 7'), 
     "vwx" => array('item 8'), 
    ); 

    After this is send by Jquery UI: 
    neworder:abc[]=1&def[]=6&ghi[]=2&jkl[]=4&mno[]=0&pqr[]=3&stu[]=7&vwx[]=5 

    I've tried this: 
     $filename = 'config.php'; 

     $lines = file($filename , FILE_IGNORE_NEW_LINES); 
     $linenumber = 2; 
     foreach($_POST['neworder'] AS $name => $val){ 
      $phost = $val[0]; 

      $lines[$linenumber] = ' "'.$name.'" => array(\'' . $phost . '\'),'; 
      $linenumber++; 
     } 

     file_put_contents($filename , implode("\n", $lines)); 

    But the '$val' is not send with Jquery only the order. 

    */ 
} 
?> 
+1

Zapisywanie danych w plikach php to zły pomysł. Możesz przechowywać je w formacie json lub xml. Jeśli chcesz zrobić to na większą skalę/częściej, musisz użyć bazy danych. – user568109

+0

@GerritHoekstra Cześć Chcę ci pomóc i myślę, że nie jest to takie trudne, ale chcę wiedzieć, dlaczego robisz to w tak zły sposób? Czy mogę zmienić jego część, ponieważ stała się lepsza? Mam na myśli ogólnie tabele z dwiema lub więcej kolumnami, które można posortować za pomocą jui i jako ich rodzaje lub jako użytkownik kliknie przycisk, aby zapisać nowe zamówienie? dlaczego nie używasz formatu JSON lub XML do zapisania? a plik o nazwie JSON_Config_reader.php odczytuje ten plik JSON i tworzy tę tablicę? – ncm

+0

@GerritHoekstra - wiesz co. Możesz po prostu napisać komentarz do mnie mówiąc "miła próba". – ncm

Odpowiedz

1

Będziesz chcesz używać usort z zamknięciem (dostępny w PHP 5.3+), aby dostać klucze w porządku, że trzeba je w

$newOrder = $_POST["neworder"]; 
$config_keys = array_keys($config); 
usort($config_keys, function($a, $b) use($newOrder) { 
     return array_search($a, $newOrder) - array_search($b, $newOrder); 
}); 

Następnie można zmienić przepisywania $ config w nowym porządku

$newConfig = array(); 

foreach($config_keys as $key){ 
    $newConfig[$key] = $config[$key]; 
} 
$config = $newConfig; 
unset($newConfig); 

Stąd możesz utrzymywać $ config w jakiejkolwiek metodzie, która ma największy sens dla twojego przypadku użycia. Radziłbym przed użyciem go do utworzenia pliku php, jednak lepszym rozwiązaniem może być użycie

file_put_contents($cacheFile, serialize($config)); 

następnie odzyskać

$config = unserialize(file_get_contents($cacheFile)); 
+1

Dzięki, wykorzystam to. Współpracuje z tej modyfikacji w jQuery UI: 'aktualizacji: function() { \t \t \t \t \t \t var a = $ ('# mojatabela tbody') sortable ('toArray.'); \t \t \t \t \t \t var newOrdering = []; \t \t \t \t \t \t dla (var i = 0; i user1480019

1

Istnieje tak wiele wątków, które obejmuje problemu

  1. jQuery UI Sortable, then write order into a database
  2. save jquery ui-sortable positions to DB
  3. Optimal way to save order of jQueryUI sortable list with Meteor
  4. http://dev.nirmalya.net/articles/javascript/saving-ordering-of-a-sortable-list-using-jquery-ui

Jestem pewien, że znajdziesz tam odpowiedź.Wszystko jest o uzyskanie zamówienia przez

$('#mylist').sortable('toArray'); 

zapisać go do bazy

a następnie dostać rozkaz z bazy danych i pokazać go poprawnie z pętli. Zapoznaj się z samouczkami.

0

$(function() { $("ul.sortable").sortable({ connectWith: '.sortable', update: function(event, ui) { /* var position = $('.sortable').sortable('serialize', { key: 'menu', connected: true });*/ $('div').empty().html($('.sortable').serial()); } }); });

+0

potem dodać, że kod – waheed

+0

(function ($) { $ .fn.serial = funkcja() { var tablica = []; var $ elem = $ (ta) $ elem.each (function (i) { var menu = this.id; $ ('li', this) .each (function (e) { array.push (menu + '[' + e + '] = '+ this.id) }); }); powrotu Array.join (' &'); } }) (jQuery) – waheed

+2

Edytuj swoją odpowiedź, nie zamieszczaj kodu w komentarzach. –

Powiązane problemy