サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
体力トレーニング
tsutomuuchima.hatenadiary.org
jsonengineをシンプルに扱うことの出来るjQueryプラグインを書いたんだけど公開するかはまだ迷い中。ホンのちょっとだけ便利かなーと。こんな感じで書けます。 jquery.jsonengine.js のサンプル $(function() { //スタイル1：デフォルトのdocTypeを指定しパラメータをオブジェクトリテラルで渡す。updateは必ず_checkUpdatesAfterが付く。 $.je.docType('tasks'); $.je.create({"foo":"bar"}, function(response, status){ // do something with task here }); $.je.read({"foo":".eq.bar"}, function(response, status){ // do something with task he
jsonengineとExtJSを使えば20行位のJavaScriptコードでtreeが動的に表示出来ちゃいます。勿論サーバーサイドは何も書きません。 ExtJSについてはここを参照してください。 http://extjs.co.jp/products/js/ 私が書いたデモはここ。 http://uchjava.appspot.com/samples/extjs/samples/tree.html コードはこんな感じ Ext.onReady(function() { var treePanel = new Ext.tree.TreePanel( { dataUrl : '/_je/testTree', requestMethod: 'GET', nodeParameter: null, root: { nodeType: 'async', text : '/', id : 'xxx' }
jsonengineのサンプルであるbbs.htmlはそのままだとローカル開発環境で動かした場合に「java.lang.IllegalArgumentException: Invalid uri」が発生し更新できない。例外発生の原因はyahoo apiサービスである日本語形態素解析を利用しているのが原因。問い合わせにGETメソッドを使用しているのだがパラメーター文字列の解釈で例外が発生するようだ。本番環境のappspot.comへデプロイすれば動作するが動作確認の為に毎回デプロイすると非常に開発のリズムが悪い。 全文検索機能は開発時にも是非使いたい。そうじゃないと魅力が半減してしまい結局サーバーサイドへ手を出す羽目になってしまう。 何とかならないかと詳しく調べたところyahoo apiはPOSTメソッドの問い合わせにも対応していたのでそれでテストしてみた。結果は問題なく意図通り動作した。具
今回はデータの検索機能を実装します。 検索ウィンドウの作成 検索ウィンドウは以下に示したようなフォームになります。検索項目は更新系のフォームとほぼ同じです。仕様は Idは完全一致検索 氏名はLike検索 職種は完全一致検索 給料は>=、<=検索 部署は完全一致検索 とします。 検索ウィンドウ var FindWindow = function(){ var extWin = null; this.show = function(title, url){ var form; if (extWin == null) { form = new Ext.FormPanel({ method: 'POST', id: 'employee-form', baseCls: 'x-plain', labelWidth: 50, defaults: {width: 190}, defaultType: 't
GAE/Jでセッションを有効にすると_ah_SESSIONがどんどん膨れ上がっていきます。無駄なデータは容量の圧迫にもなるので定期的に消さなければなりません。 _ah_SESSIONを削除するにはGoogle app engineのコンソールから手動で削除するか、用意されている削除用サーブレットを定期的に実行すればOK。 Provide a servlet for session cleanup - Google App Engine for Java | Google Groups http://groups.google.com/group/google-appengine-java/browse_thread/thread/4f0d9af1c633d39a?pli=1 しかし_ah_sessioncleanupサーブレットで削除される件数は一度に100件まで。それを一日一回実行してあ
Slim3の「Getting Started」を例にプロジェクトを作成。プロジェクト名は「com.appspot.simplebookmarks」とした。パッケージも同様。 まずブラウザから http://localhost:8888/bookmark/ をアクセス。プロジェクトの作成以外は何もしていなので当然エラー画面が表示。さっそくコントローラーを作ります。gen-controllerを実行、「/bookmark/」を指定。OKボタンでさくっと作成。再度アクセスすると「Hello bookmark Index!!」と表示されました。よしよし。この画面は登録されたブックマークの一覧を表示するメイン画面とします。さっそく実装していきたいところですが、データは何もない状態。なのでまずはデータを登録する画面から作る事にします。 ブックマーク登録画面の作成 まず登録画面のモックアップをhtmlで
slim3のコントローラーは isGet(), isPost(), isPut(), isDelete() が用意されているのでRESTが簡単に書ける。便利だなぁ。なのでREST用のコントローラーを抽象化して RestController ってのを書いてみた。 ソースは以下の通り。 RestController.java package tutorial.cool.controller; import java.io.IOException; import java.io.OutputStreamWriter; import java.io.PrintWriter; import javax.servlet.http.HttpServletResponse; import org.slim3.controller.Controller; import org.slim3.controlle
slim3の勉強を始めてみる。まずは足し算から。 Getting Started に沿ってプロジェクト整備。そしてページとコントローラーを作成。ここでは"/add/"と指定して生成した。 index.jsp <%@page pageEncoding="UTF-8" isELIgnored="false"%> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> <%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> <%@taglib prefix="f" uri="http://www.slim3.org/fu
大量のデータを使用するテーブルをHTMLで書くと画面をスクロールする事になりますが、その際にヘッダも一緒にスクロールされてしまい現在見ている項目が何なのか確認する事が出来ない時があります。 そんな時は Super Tables を使えばエクセルのようにヘッダを固定して表示する事が出来ます。縦横のヘッダを同時に固定させる事も可能です。サンプルを作ってみました。ついでにデータ入力可能にしてみました。 エクセル風入力可能なテーブル http://www.geocities.jp/uchblog/supertables/mySuperTablesDemo01.html ソースは以下のような感じで。 <div class="fakeContainer"> <table id="demoTable" class="demoTable"> <tr> <th>Account</th> <th>First
Wifi接続でYouTubeを見ると何故か重い。何でこんなに遅いんだー？ってネットで調べてみたら「802.1bで接続すると早いよ。gで接続したら遅い」なんて情報が。 試しに802.1bにルーターを設定したところ爆速に。これぞ無線LANの威力って感じになりました。
<table border="1"> <tr> <td> <div style="white-space:nowrap; overflow:hidden; width:8em;"> 長い名前です。長い名前です。長い名前です。長い名前です。 </div> </td> </tr> </table>
前回でデータ一覧を表示させる事が出来るようになりました。今回はデータの更新関係についてサンプルを作っていきます。 新規追加ウィンドウの作成 まずはモックアップから。ExtJSのダイナミックフォームを使用します。 フォームウィンドウのソース Ext.QuickTips.init(); Ext.form.Field.prototype.msgTarget = 'side'; var FormWindow = function(){ var extWin = null; this.show = function(title, url){ if (extWin == null) { var form = new Ext.FormPanel({ method: 'POST', id: 'employee-form', baseCls: 'x-plain', labelWidth: 40, defau
はじめに 2008年09月にGoogleからGoogle Chromeがリリースされました。より快適なAjaxアプリを実現していくのが目標のようです。Chromeを使用した方ならわかって頂けると思いますがAjax Webアプリケーションはまだまだ未成熟で可能性がある事を感じさせてくれます。今後ますますAjaxを多用したWebアプリケーションが重要となっていくでしょう。 この記事ではJavaで美しく実用的なAjaxアプリケーションを作る第一歩としてExtJS、SAStruts、JSONICを用いて簡単なCRUDアプリケーションの作成過程を記載していきたいと思います。 今回作成するアプリケーションは社員マスター管理アプリです。完成イメージを以下に示します。 本記事は以下の順序で進みます。 画面モックアップの作成 データベースの準備 サーバーサイドでの実装 一覧表示機能の実装 新規追加の実装 更
ようやく本題だが、getElementById() の戻り値は文字通り要素ノード（Element）であり、テキストノードではない。要素ノードの nodeValue は常に null を返す。 > 「CADデータ T5302970TX000002B」を取り出すには node.firstChild.data; // DOM1 (IE, Firefox, Opera, Safari) node.textContent; // DOM3 (Firefox, Opera, Safari) node.innerText; // IE, Opera, Safari
$TEEDA_WEB_APP/WEB-INF/sun-web.xmlを作成する。内容は下記の通り。 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE sun-web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Application Server 9.0 Servlet 2.5//EN" "http://www.sun.com/software/appserver/dtds/sun-web-app_2_5-0.dtd"> <sun-web-app error-url=""> <class-loader delegate="false"/> <property name="useMyFaces" value="true"/> </sun-web-app> 以上です。これだけ。 <class-loader
このページを最初にブックマークしてみませんか？
『TsutomuUchimaの日記』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
