1

製品機能リストを動的に作成し、すべての値を改行文字で区切られた1つの文字列にまとめて、データベースに保存するコードがあります。この文字列がビューに渡されると、順序付けられていないリストとして出力されます。ブロックを編集しようとすると、リストに既にあるものが表示されないため、機能リストでなくても、ブロックを編集する必要があるたびにすべての機能を再入力する必要があります(タイトルやその他のテキスト領域がいくつかあります) 。php変数を編集ページに入れると、保存されているものが表示されますが、リストにすぐに追加して、個別に表示しないようにする必要があります。基本的に、「autoappendTo」するために必要<ul>です。これが私のコードです...

リストをcontroller.phpに保存するコントローラー関数

public function save($args) {
        $args['features'] = implode("\n", $args['features']);//combine all feature items into one string, separated by "newline" characters
        parent::save($args);
    }

myedit.php-これによりリストに表示されます。置くだけecho $featuresで文字列が出力されます。

echo '<div class="ccm-block-field-group">';
echo '<h2>' . t('Features') . '</h2>';
echo '<input type="text" id="inputList" />';
echo '<button type="button" id="addList">Add</button>';
echo $features = explode("\n", $features);
        foreach ($features as $feature) {
            echo '<li class="currentFeatures">' . $feature . '</li>';
        };

echo '<ul class="featureList">';
echo '</ul>';
echo '</div>';

myauto.js-リストの作成を処理します

var listItemCounter = 0;
    $("#addList").click(function() {
        listItemCounter++;
        var text = $("#inputList").val(); //assign a unique id number to this button, so it knows which hidden field to remove when clicked
        var buttonDataId = text + '<button data-id="' + listItemCounter + '">x</button>';
        if(text.length){
            $('<li />', {html: buttonDataId}).appendTo('ul.featureList');
            $('<input type="hidden" name="features[]" value="' + text + '" data-id="' + listItemCounter + '" />').insertAfter('ul.featureList');
            };
    });
    $('ul').on('click','button', function(el){
        $('input[data-id="' + $(this).attr('data-id') + '"]').remove();//remove the hidden field so it does not get POSTed when user saves
        $(this).parent().remove()
    });

そして最後に私のdb.xmlの一部

<field name="features" type="X2"></field>
4

1 に答える 1

1

他の質問( https://stackoverflow.com/a/14968046/477513 )の「ビュー」について説明したのと同様のことをしたいと思うでしょう。

リストを文字列から配列に(を介してexplode("\n", $features))変更し、それらの各機能でjavascriptを実行します。これは基本的に、誰かがテキストボックスを介して新しいアイテムを追加するときに行うJavaScriptと同じであるため、そのすべてのコードを関数に移動し、両方の状況で関数を呼び出す必要があります(そうでない場合は、同じものをコピーして貼り付けます) 「Don'tRepeatYourself」ルールに違反し、必然的に将来バグにつながるコード)。したがって、auto.jsコードは次のようになります。

var listItemCounter = 0;

function addItem(text) {
    if (text.length) {
        listItemCounter++;
        var itemHtml = '<li data-id="' + listItemCounter + '">'
                     + text
                     + '<button data-id="' + listItemCounter + '">x</button>'
                     + '</li>';
        var inputHtml = '<input type="hidden" name="features[]" value="' + text + '" data-id="' + listItemCounter + '" />';
        $('ul.featureList').append(itemHtml);
        $('ul.featureList').after(inputHtml);
    }
}

function removeItem(id) {
    $('input[data-id="' + id + '"]').remove();
    $('li[data-id="' + id + '"]').remove();
}

$("#addList").click(function() {
    additem($("#inputList").val());
});

$('ul').on('click','button', function(el) {
    var id = $(this).attr('data-id');
    removeItem(id);
});

次に、edit.phpファイルに次のコードを追加して、保存されたデータを出力し、それぞれに対してaddItem関数を呼び出します。

<?php
//populate existing data when edit dialog is first opened
$featuresPHPArray = explode("\n", $features);
$featuresJSArray = Loader::helper('json')->encode($featuresPHPArray);
?>
<script>
var savedItems = <?php echo $featuresJSArray; ?>;
$.each(savedItems, function() {
    addItem(this);
});
</script>
于 2013-02-21T19:58:02.787 に答える