从 ajax 调用加载 Dojo 表单

Posted 2023-02-16

技术标签:

【中文标题】从 ajax 调用加载 Dojo 表单【英文标题】：Load Dojo form from ajax call 【发布时间】：2012-12-09 01:05:10 【问题描述】：

我正在尝试实现这样的东西。 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    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()中做准备

【问题讨论】：

【参考方案1】：

首先;您需要在 html 上运行 dojo 解析器，以便它接受 data-dojo-type (fka dojoType) 属性，如下所示：

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

这当然只会实例化 dojo 类型设置为某些东西的 dijits，例如（对于 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>。

所以您需要更改设置为innerHTML 的ajax 内容，以便解析器识别dijit.form.Form 类型的表单。也就是说，我敦促人们使用一套完整的 dijit.form.* 元素作为输入字段。

关于：