1

私はこのようなものを実装しようとしています。 http://app.maqetta.org/mixloginstatic/LoginWindow.html

ログインページをロードしたいのですが、サインアップボタンをクリックすると、ajax がログインフォームをサインアップフォームに置き換えます。

このコードを使用してこれを機能させました

dojo.xhrGet({
        // The URL of the request
        url: "'.$url.'",
        // The success callback with result from server
        load: function(newContent) {
            dojo.byId("'.$contentNode.'").innerHTML = newContent;
        },
        // The error handler
        error: function() {
            // Do nothing -- keep old content there
        }
    });'

唯一の問題は、新しいフォームが Dojo フォームではなく通常のフォームとして読み込まれることです。フェイザーでスクリプトを返そうとしましたが、何もしません。

<div id="loginBox"><div class="instructionBox">Please enter your details below and click <a><strong>signup</strong>
    </a> to have an activation email sent to you.</div>
    <form enctype="application/x-www-form-urlencoded" class="site-form login-form" action="/user/signup" method="post"><div>
    <dt id="emailaddress-label"><label for="emailaddress" class="required">Email address</label></dt>
    <dd>
    <input 0="Errors" id="emailaddress" name="emailaddress" value="" type="text"></dd>
    <dt id="password-label"><label for="password" class="required">Password</label></dt>
    <dd>
    <input 0="Errors" id="password" name="password" value="" type="password"></dd>
    <dt id="captcha-input-label"><label for="captcha-input" class="required">Captcha Code</label></dt>
    <dd id="captcha-element">
    <img width="200" height="50" alt="" src="/captcha/d7849e6f0b95cad032db35e1a853c8f6.png">
    <input type="hidden" name="captcha[id]" value="d7849e6f0b95cad032db35e1a853c8f6" id="captcha-id">
    <input type="text" name="captcha[input]" id="captcha-input" value="">
    <p class="description">Enter the characters shown into the field.</p></dd>
    <dt id="submitButton-label">&nbsp;</dt><dd id="submitButton-element">
    <input id="submitButton" name="submitButton" value="Signup" type="submit"></dd>
    <dt id="cancelButton-label">&nbsp;</dt><dd id="cancelButton-element">
    <button name="cancelButton" id="cancelButton" type="button">Cancel</button></dd> 
       </div></form>

    <script type="text/javascript">

            $(document).ready(function() {

                var widget  = dijit.byId("signup");

                if (widget) {
                   widget.destroyRecursive(true);
                } 

                dojo.parser.instantiate([dojo.byId("loginBox")]); 
                dojo.parser.parse(dojo.byId("loginBox"));
            });

            </script></div>

これを道場フォームとしてロードする方法についてのアドバイス。ところで、私は Zend_Dojo_Form を使用しています。コードを直接実行すると、すべてが機能しますが、ajax では機能しません。ありがとう。


アップデート

アクションでフォームをロードして __toString() を実行すると、ajax からフォームをロードしたときに機能することがわかりました。__toString() で準備する必要があります

4

1 に答える 1

1

まず; 次のように、data-dojo-type (fka dojoType) 属性を受け入れるために、html で dojo パーサーを実行する必要があります。

dojo.parser.parse( dojo.byId("'.$contentNode.'") )

もちろん、これは dojo タイプが何かに設定されている dijit のみをインスタンス化します (たとえば、html5 1.7+ 構文の場合) <form data-dojo-type="dijit.form.Form" action="index.php"> ... <button type="submit" data-dojo-type="dijit.form.Button">Send</button> ... </form>

したがって、パーサーがタイプ dijit.form.Form のフォームを認識するように、innerHTML に設定されている ajax コンテンツを変更する必要があります。そうは言っても、入力フィールドとして dijit.form.* 要素の完全なセットを使用することをお勧めします。

に関してで:

$(document).ready(function() {});

この関数は決して呼び出されません。documentinnerHTML を追加している は、おそらくかなり前から準備ができていました。

この号の Zend について:

Zend_上記の出力フォームをDojo タイプのフォームからレンダリングしている可能性が最も高いでしょう。レンダラーが に設定されている場合、programmatic上記の html に ID=>dojoType マッピングのレジストリを含むスクリプトが表示されます。innerHTML 属性値として挿入するときの動作<script>は、ほとんどの場合 (!)、スクリプトは実行されません。

フォーム コントローラに対して、次の擬似的なものを試してみてください。

リクエストが ajax の場合 dojoHelper セット レイアウトdeclarative
それ以外の場合 dojoHelper セット レイアウトprogrammatic

于 2012-12-09T10:41:03.567 に答える