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>

关于如何将其加载为 dojo 表单的任何建议。顺便说一句，我正在使用 Zend_Dojo_Form，如果我直接运行代码，那么一切正常，但通过 ajax 它不起作用。谢谢。

更新

我发现如果我在我的操作中加载表单并在其上运行 __toString() ，当我从 ajax 加载表单时它会起作用。它必须在 __toString() 中做准备

4

1 回答 1

1

Firstly; You need to run the dojo parser on html, for it to accept the data-dojo-type (fka dojoType) attributes, like so:

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

This will of course only instantiate dijits where the dojo type is set to something, for instance (for html5 1.7+ syntax) <form data-dojo-type="dijit.form.Form" action="index.php"> ... <button type="submit" data-dojo-type="dijit.form.Button">Send</button> ... </form>.

So you need to change the ajax contents which is set to innerHTML, so that the parser reckognizes the form of the type dijit.form.Form. That said, I urge people into using a complete set of dijit.form.* Elements as input fields.

In regards to:

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

This function will never get called. The document, youre adding innerHTML to, was ready perhaps a long time a go.

About Zend in this issue:

Youre most likely rendering the above output form from a Zend_ Dojo type form. If the renderer is set as programmatic, you will see above html a script containing a registry for ID=>dojoType mappings. The behavior when inserting <script> as an innerHTML attribute value, the script is not run under most circumstances (!).

You should try something similar to this pseudo for your form controller:

if request is ajax dojoHelper set layout declarative
else dojoHelper set layout programmatic

于 2012-12-09T10:41:03.567 回答