2

私がやろうとしているのは、販売するアイテムのリストがあり、誰かがそのうちの1つを選択したときに、それをオブジェクトのリストに追加して、同じページに表示し、その横に削除ボタンがあるようにすることです。ユーザーはアイテムを挿入/削除でき、確認ボタンを押すと販売が終了します。

私は ajax の例と動的コンポーネントの作成方法を調べていますが、どうすればよいかわかりません。どうすればそれを行うことができますか？

テーブルセルがクリックされたときの私のJavaScript関数は次のとおりです。

function selectRow(id) {
$.ajax
({
    type: "POST",
    url: "venda.php",
    data: {selected: id},
    cache: false,
    success: function(data)
    {
    }
}); 
}

ajax関数は機能しますが、phpに要素をhtmlに追加し、そのitenを参照する削除ボタンを追加するにはどうすればよいですか? そして最後に、すべての要素を取得して、クライアントの「バッグ」にも入れる必要があります。

4

2 に答える 2

2

それにはいくつかの方法があります。1 つのオプションとして、選択したアイテムを $_SESSION 変数に保存し、venta.php から html マークアップとして出力することもできます。また、クリック時にイベントをアイテム (要素) に追加して、それらを削除することもできます。これは疑似コードのようなものです。もちろん、データを検証する必要があります。少なくともこれは、プラグインなしで php、jquery、および javascript を使用して項目の削除/追加を処理する方法に関するフロー プロセスを説明しようとしています。

shop.php (選択するアイテムのテーブルが存在する場所):

<!-- here you add jquery and your own javascript to play with that -->

<table>
    <tr>
        <td><a name="item_id" href="#">Item one</a></td>
    </tr>
</table>
<div class="my-selected-items"></div>
<a hef="link-to-proceed-order">Proceed order</a>

JavaScript:

// add the result of php response to the *selected items* div
function selectRow(id) {
$.ajax
({
    type: "POST",
    url: "venda.php?action=add",
    data: {selected: id},
    cache: false,
    success: function(data)
    {
        $('.my-selected-items').html(data);
        register_delete_action();
    }
}); 
}

function register_delete_action()
{
    $(".remove-item").click(function(){
        $.ajax
        ({
            type: "POST",
            url: "venda.php?action=delete",
            data: {selected: id},
            cache: false,
            success: function(data)
            {
                $('.my-selected-items').html(data);
                register_delete_action();
            }
        }); 
    });
}

venta.php 

$action = $_GET['action'];

switch ($action)
{
    case "add": addItem();
    case: "delete": deleteItem();
}

function addItem(){
    $selected_id = $_POST['selected'];

    if(!array_key_exists('items', $_SESSION))
    {
        $_SESSION['items'] = array();
    }
    $_SESSION['items'][$selected_id] = array("id" => $item['id'], "name" => $item['name']);


    //print the selected items in html markup
    echo  "<ul>";
    foreach ($_SESSION['items'] as $id => $selection)
    {
        echo '<li> <a href="#" class="remove-item" name="' .$selection["name"] . '">' .$selection["name"] . '</a> </li>';
    }
    echo  "</ul>";
}

function deleteItem(){
    $selected_id = $_POST['selected'];
    unset($_SESSION['items'][$selected_id]); 

    //print the selected items in html markup
    echo  "<ul>";
    foreach ($_SESSION['items'] as $id => $selection)
    {
        echo '<li> <a href="#" class="remove-item" name="' .$selection["name"] . '">' .$selection["name"] . '</a> </li>';
    }
    echo  "</ul>";
}
于 2012-07-15T22:18:46.280 に答える
0

JS：

function selectRow(id) {
    $.ajax({
        type: "POST",
        url: "venda.php",
        data: {selected: id},
        cache: false,
        success: function(data)
        {
            $('css_selector of div you want the stuff displayed in').append(data);
        }
    }); 
}

PHP：

$input = $_POST['selected'];

// do stuff with input

echo $output; // echo data to be returned
于 2012-07-15T22:09:01.740 に答える