jQuery プラグインTag-it!の実装に取り組んでいます。さまざまなタイプの製品 (ラップトップ、テレビ、ガジェットなど) に属性を割り当てるための製品入力フォームを使用します。
概念は次のとおりです。新しい製品を追加する場合、最初に、ユーザーが追加する製品のドロップダウンから製品カテゴリを選択すると、jQuery .change() イベントがトリガーされ、関連するすべての属性を取得するための ajax 呼び出しが行われます。そのカテゴリーに。たとえば、テレビを追加する場合は、ajax 呼び出しでインチ、パネル タイプ、hdmi の 3 つの入力を入力する必要がありますが、ラップトップを追加する場合は、これらの入力を cpu、ram、hdd、画面などにする必要があります。それ!単語のリスト(私の場合は属性)と単語のセットを選択するための入力フィールドで動作します。私の場合、属性のタイプごとに、個別の入力フィールドにデータを入力し、tagit プラグインに割り当て/バインド/適用したいと考えています (申し訳ありませんが、他に説明する方法がわかりません)。
Javascript:
<script src="../js/tag-it.js" type="text/javascript" charset="utf-8"></script>
<script>
$(function(){
// Sample1: var sampleTags1 = ["red", "green", "blue"];
// Sample2: var sampleTags2 = ["lcd", "plasma", "tft"];
var sampleTags1 = [<?=createTags('name', 'tags', 1)?>];
// createTags($name, $tags, $id) is a PHP function that returnss a list of tags for a given attribute
// Question 1: how do I place this here after a new input is added to the DOM?
$('#myTags').tagit();
//Question 2: for each input added to the DOM I need also to add this block in the javascript:
$('#allowSpacesTags1').tagit({itemName: 'item1', fieldName: 'tags1',
availableTags: sampleTags1, allowSpaces: true
});
$('#removeConfirmationTags').tagit({
availableTags: sampleTags,
removeConfirmation: true
});
});
$(document).ready(function() {
$('#cat_id').change(function(){
$.post('../includes/ajax.php', {
cat_id : $(this).find("option:selected").attr('value')}, function(data) {
$("#tagholder").html(data);
});
});
});
</script>
Ajax は呼び出しごとに以下を返します。
<ul id="allowSpacesTags'.$row['ctid'].'"></ul> // $row['ctid'] is the ID for that attribute
タグ/属性を入力するための入力フィールドを表します。
誤解を招く前に、私は PHP でこれを行う方法を尋ねているわけではありません。私の質問は、sampleTags1 のような変数を動的に追加し、ajax によって DOM に追加された新しい入力ごとに tagit() を呼び出す方法についてです。私の質問が十分に明確でない場合は、必要な情報を提供しようとします。コード コメントの質問を見てください。ありがとう!