今流行の…

Ajaxで一行掲示板を作ってみました。CGI部分は*.aspxで書いています。ビール3本飲んだところでやっと完成！(その影響でテスト書き込みが意味不明)トップページにおいてみたけど、どうかな？リロードを必要としないし、埋め込むのが簡単なので、大きなページの片隅に置いたりするにはいいですね。

検索エンジン対策にサイドバーを非同期に読み込めば…なんて夢もひろがリング。うちのページは　ヘッダー→サイドバー→コンテンツ　の順番に書いているので、多分検索に引っかかりにくいんですよね。まぁ、それはそれでかまわないんだけど･･･。データベースに繋げて掲示板にまでのんびり育てようと思います。

しょぼいけど、勉強したい人に。

ajax.js

function $(tagId)
{
    return document.getElementById(tagId);
}

function getFile(filename)
{
    request = createXMLHttpRequest();
    if (request)
    {
        request.onreadystatechange = load;
        request.open("GET", filename, true);
        request.send(null);
    }
}

function load()
{
    if (request.readyState == 4)
    {
        switch(request.status)
        {
            case 200:
                document.form1.Text1.value = "";
                text = request.responseText;
                text = text.replace(/</g,"&lt;");
                text = text.replace(/>/g,"&gt;");

                logs = text.split("\r\n");
                logs = logs.slice(0, 10);

                $("log").innerHTML = logs.join("<br />");
                break;
            case 403:
                document.form1.Text1.value = "access denied.";
                break;
            case 404:
                document.form1.Text1.value = "file not faund.";
                break;
        }
    }
    else
    {
        document.form1.Text1.value = "loading..."
    }
}

function saveFile(author, text)
{
    request = createXMLHttpRequest();
    if (request)
    {
        request.onreadystatechange = load;
        request.open("GET", "edit.aspx?"
            + "author=" + encodeURI(author) + "&"
            + "text=" + encodeURI(text), true);
        request.send(null);
    }
    document.form1.Text1.value = "";
}

function createXMLHttpRequest()
{
    try
    {
        return new ActiveXObject ("Microsoft.XMLHTTP");
    }
    catch(e)
    {
    try {
            return new XMLHttpRequest();
        }
        catch(e)
        {
            return null;
        }
    }
    return null;
}

edit.aspx

<%@ Page Language="C#" %>
&ltscript runat="server">
    protected void Page_Load(object sender, System.EventArgs e)
    {
        if (!IsPostBack)
        {
            string text = Request.QueryString["text"];
            string author = Request.QueryString["author"];
            if (text != null)
            {
                text = HttpUtility.UrlDecode(text);
                author = HttpUtility.UrlDecode(author);
                string path = Server.MapPath("memo.txt");

                using (System.IO.StreamReader reader
                    = new System.IO.StreamReader(path))
                {
                    author += ": " + text
                              + " [" + DateTime.Now.ToString("G") + "]";
                    author += "\r\n" + reader.ReadToEnd();
                }

                using (System.IO.StreamWriter writer
                    = new System.IO.StreamWriter(path))
                {
                    writer.WriteLine(author);
                    Response.Write(author);
                }
            }
        }
    }
</script>

あとはもうひとつページを用意して、getFile　saveFileを呼ぶだけです。Ajaxを勉強しようというサイトを参考にしました。$(“id”)なんていう使い方に少し惚れた感じ(*´ω｀*) 適当なところも混じっているので、今度リファクタリングもかねてコード見直して、データをXML保存にして･･･して・・・Zzz

IE6/FF1.5でのみ確認