1

タイムトラッキングシートアプリケーションがあります。ここでは、X軸（上）に1週間の日付を表示し、Y軸（下）にタスクを表示します。以下に示すように、各エントリに対してコメントを入力するために、すべてのテキストボックスの後に@アイコンを付けます。

****************************************************
#    |  Sun | Mon  | Tue  | Wed | Thu |  Fri | Sat |
****************************************************
Task1 ____@ _____@ _____@ _____@_____@______@______@     
Task2 ____@ _____@ _____@ _____@_____@______@______@

したがって、この@アイコンをクリックすると、コメントを入力するためにフローティング（または他のタイプのテキストボックス）を開く必要があります。これは、開いたもののXマークを押した後に非表示にする必要があります。ご想像のとおり、データベースに送信するには、このユーザーが入力したコメントを保存する必要があります。では、これらのコメントを配列変数として保存するにはどうすればよいですか。タスク入力と合計テーブルのコーディングが完了しました。しかし、特定の@アイコンの位置にあるフローティングテキストボックスを開く方法がわかりません。また、それらを非表示にした後、特定の日のこれらの特定のタスクに対するこれらのコメントを保存する効率的な方法が得られていません。

私のサンプルJavascript：

function comment(id,day)
{
var textinput="<div id='closeit'>
                  Comments:<input type='text' name='comm["+id+"]["+day+"]' />
               </div>
               <div id='closing' onclick='closecomment("+id+","+day+")'>X
               </div>";
              $('#comms').html(textinput);
}
function closecomment(id,day)
{
        var str='"comm['+id+']['+day+']"';
        var element = document.getElementById(str);
        alert(element.value);
        closeit.style.visibility='hidden' // this is for hiding
    closing.style.visibility='hidden' // this is for hiding
    var newelement = document.getElementById(str);
    alert(newelement.value); //I am able to get the value but I am looking for         storing  it and filling the same text box when it is accessed again
}

私のサンプルHTML：

<input type="text" id="comm[0][0]" />
<input type="text" id="comm[0][1]" />
<input type="text" id="comm[1][0]" />
<input type="text" id="comm[1][1]" />

IE6、IE7、または8で動作する例を教えてください。私の環境はPHP（CodeIgniterフレームワーク）、JQUERY、XAMPPです。

4

1 に答える 1

1

格納部分については、配列を使用する必要はまったくありません。すべての「@」リンク（またはページ内の任意の場所）の横に、意味のある名前で非表示の入力を追加するだけです。フローティングdivを閉じるときは、コメントを非表示の入力に入れてください。そうすれば、phpファイルは送信時にこれらの値を読み取って処理できるようになります。

フローティングdivの表示は、絶対（または、テーブルセルの横に表示する場合は相対）の位置の問題です。このcssを試してください：

div#comms {
  position: absolute;
  width: 300px;
  left: 50%;
  margin-left:-100px;
  height: 200px;
  top: 50%;
  margin-top:-150px;
}
于 2009-12-29T14:55:50.660 に答える