フォーム入力用のWYSIWYG

jWYSIWYG
http://projects.bundleweb.com.ar/jWYSIWYG/

jQueryを用いた、軽量なWYSIWYG。
ちょこっと使用したい場合などに最適。
入力内容の保存タイミングに、少しだけ難があるので、メソッドを追加してコントロールすると吉。

以下170行目あたりに追加してみた。

        save : function()
        {
            var self = $.data(this, 'wysiwyg');
                var content = self.getContent();
                self.setContent(content);
                self.saveContent();
        },

        reset : function()
        {
            var self = $.data(this, 'wysiwyg');
                self.setContent( $(self.original).val() );
                self.saveContent();
        },

resetの方は、自分でJSで送った内容を反映させるためのコード。

汚いけど、実際使うとこんな感じ。

(管理画面でアップロード済みの任意のリンク付き画像をWYSIWYGで入力したかったのでやってみた。)

	$(function(){
		$("a.appImg").click(function(ev) {
			$('#wysiwyg').wysiwyg('save');
			addSrc = $(this).attr('href');
			addThumb = $(this).attr('rel');
			addTags = '<a href="' + addSrc + '" rel="' + addThumb + '" class="クラス名"><img src="' + addThumb + '" border="0" /></a>';
			tmpTxt = $('#wysiwyg').val() + addTags;
			$('#wysiwyg').val(tmpTxt);
			$('#wysiwyg').wysiwyg('reset');
			return false;
		});
	});

WYSIWYGエリアに任意のCSSを反映させるには、

	$(function(){
		$('#wysiwyg').wysiwyg({ css : 'CSSファイル' });
	});

でOK。

いつもこの手のJSベースのWYSIWYG使って思うんだけど、IEのURLとかの自動補完を何とかしてほしい・・・。仕様と言えば仕様なんだけど、勝手に変わっていて涙目になる。

なので登録するときは、リンクや画像も絶対パスになっちゃうよね・・・。

""とかが勝手に外れるのもいただけないな。

jQuery tablesorter 数値カンマ対応

tablesorter
http://tablesorter.com/docs/

jQueryのプラグインで、テーブルのソートや色づけなどを簡単に行えるようにするプラグイン。

数値がカンマ区切りされていた際に、数値として指定しても、ソートがカンマまでの値で計算されてしまうため、プチ改造。

jquery.tablesorter.js(2.0.3)の660行目

var i = parseFloat(s.replace(/,/g,”));

と変更。
あと、ほかの通貨やら±やら、そのあたりの対応のため、正規表現の修正も必要になるはずだけど、そっちはあとでやる。