1

jQuery を使用してエントリのリストを<LI></LI>タグ間で並べ替え、次に Ajax 投稿を使用して順序を検証し、返されたコンテンツでページを「更新」します。

$.ajax({url: "./test.php?id=<?php echo $id; ?>&action=modify",
    contenttype: "application/x-www-form-urlencoded;charset=utf-8",
    data: {myJson:  data},
    type: 'post',
    success: function(data) {
        $('html').html(data);
        OnloadFunction ();
        }
    });

次に、リストを並べ替えることができなくなります (明確かどうかはわかりません...)。の内容を$(document).ready内に移動し、変更を処理するブロック内OnloadFunction ()でそれを呼び出そうとしました :<script>OnloadFunction ();</script>

$action= $_GET['action'];
if ($action == "modify") {
// Code here
}

しかし、うまくいきません...

その方法がわかりません。誰でも助けることができますか？

コードの主要部分を取り除いて、必要なものだけを残しました (ファイル名: test.php)

<!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>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <script type="text/javascript" src="jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="jquery-ui-1.9.0.custom.min.js"></script>
    <script>
    $(document).ready(function(){ 
        //alert("I am ready");
        OnloadFunction ();
        }); 

    function OnloadFunction () {
            $(function() {
            $("#SortColumn ul").sortable({ 
                opacity: 0.6, cursor: 'move',
                update: function() {}                                 
                });
            });
            //alert('OnloadFunction ends');
        }

    function valider(){
        var SortedId = new Array(); 
        SortIdNb = 0;
        $('#SortColumn ul li').each(function() {
            SortedId.push(this.id);
        });
            var data = {
            /* Real code contains an array with the <li> id */
            CheckedId: "CheckedId",
            SortedId: SortedId,
            };
        data = JSON.stringify(data);
        $.ajax({url: "./test.php?id=<?php echo $id; ?>&action=modify",
            contenttype: "application/x-www-form-urlencoded;charset=utf-8",
            data: {myJson:  data},
            type: 'post',
            success: function(data) {
                //alert(data);
                $('html').html(data);
                OnloadFunction ();
                }
            });
        }
    </script>
</head>
<body>
<?

$action= $_GET['action'];
$id = $_GET['id'];
if ($id == 0) {$id=1;}
$id += 1;
if ($action == "modify") {
    echo "action: modify<br>";
    echo "id (àvèc aççént$): ".$id."<br>"; // "(àvèc aççént$)" to check characters because character set is incorrect after the ajax post
    $data = json_decode($_POST['myJson'], true);
    // PHP code here to treat the new list send via the post and update the database
    print_r($data);
    }
?>
<!-- PHP code here to get the following list from the database -->
<div id="SortColumn">
    <ul>
        <li id="recordsArray_1">recordsArray_1</li>
        <li id="recordsArray_2">recordsArray_2</li>
        <li id="recordsArray_3">recordsArray_3</li>
        <li id="recordsArray_4">recordsArray_4</li>
        <li id="recordsArray_5">recordsArray_5</li>
    </ul>
</div>
<input type="button" value="Modifier" onclick="valider();">

</body>
</html>
4

1 に答える 1

1

コードをこれに変更します

$(document).ready(function(){ 
    //alert("I am ready");
    OnloadFunction ();
    }); 

function OnloadFunction () {

        $("#SortColumn ul").sortable({ 
            opacity: 0.6, cursor: 'move',
            update: function() {}                                 
            });

        //alert('OnloadFunction ends');
    }
于 2012-10-19T10:57:17.210 に答える