Mayaaが良い
今日、employeeのサンプルを作ってて、本当にMayaaは良いなーって思った。
やっぱり、参照画面と確認画面をいっしょくたにしてしまうより、別々にしたほうが良い感じになった。あと新規作成と更新も別けたほうがよいと思った。htmlファイル数は多くなるけど、Mayaaには強烈なコンポーネント化(insertプロセッサ)があるから問題なし。
今日は本当にMayaaが便利だなーと実感した日だった。
コンポーネント化すると紙芝居の見た目が、、、ってこともあるかもしれないけど、そこはAjaxというほどでは全然ないJavaScriptで十分カバーできるってことがわかった。
こんな感じでコンポーネントを呼び出すhtmlを書いて
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Windows-31j"> <link href="../../css/global.css" rel="stylesheet" type="text/css"></link> <title id="pageTitle"> Inquire - Employee Management Demo </title> </head> <body> <div id="appBody"> <div id="errorMessage"></div> <form method="GET" id="appForm"> <div id="appFormView"> <iframe src="formView.html" name=".appFormView"></iframe> </div> <input type="submit" value="previous" id="goPrevious" onclick="this.form.action = 'list.html';"> <input type="submit" value="edit" id="goEdit" onclick="this.form.action = 'edit.html';"> <input type="submit" value="delete" id="goDelete" onclick="this.form.action = 'deleteConfirm.html';"> </form> </div> </body> </html>
iframeでコンポーネントを表示しようとして、でもコンポーネントは下のようにonloadイベントで自分を呼び出したiframeを上書きしてしまう。
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Windows-31j"> <link href="../../css/global.css" rel="stylesheet" type="text/css"></link> <title id="pageTitle"> FormView - Employee Management Demo </title> <script type="text/javascript"> <!-- window.onload = function() { if (window.name != "") { var name = window.name.substring(1); var to = window.parent.document.getElementById(name); var from = document.getElementById("component"); to.innerHTML = from.innerHTML; } } // --> </script> </head> <body> <div id="component"> <table class="tablebg"> <tr> <td class="label"><span id="labelEmpno">EmployeeNo</span></td> <td class="number"> <span id="empno">7369</span> </td> </tr> <tr> <td class="label"><span id="labelEname">EmployeeName</span></td> <td class="text"> <span id="ename">SMITH</span> </td> </tr> <tr> <td class="label"><span id="labelJob">Job</span></td> <td class="text"> <span id="job">CLERK</span> </td> </tr> <tr> <td class="label"><span id="labelMgr">Manager</span></td> <td class="number"> <span id="mgr">7902</span> </td> </tr> <tr> <td class="label"><span id="labelHiredate">HireDate</span></td> <td class="date"> <span id="hiredate">1980/12/19</span> </td> </tr> <tr> <td class="label"><span id="labelSal">Salary</span></td> <td class="number"> <span id="sal">800</span> </td> </tr> <tr> <td class="label"><span id="labelComm">Commission</span></td> <td class="number"> <span id="comm"></span> </td> </tr> <tr> <td class="label"><span id="labelDeptno">Department</span></td> <td class="text"> <span id="deptno">ACCOUNTING</span> </td> </tr> </table> </div> </body> </html>
これで見た目はコンポーネント化する前といっしょ。デザイナーには優しくない気がするけど。。。
layoutはframeで雰囲気がでれば十分なので、紙芝居にもってこいかも。
Mayaaは良いなー