使用AJAX拉入頁面時，Dojo Dijit TimeTextBox不起作用

Question

我有一個帶有菜單按鈕的主頁。 單擊時，它們將使用AJAX更改主“內容”區域。 在此頁面的標題中，我具有所有適當的Dojo參考。
我知道AJAX可以用，因為我已經成功地在內容區域中提取並顯示了數據，而且我知道Dojo Dijit TimeTextBox可以用，因為我在用AJAX進行任何呼叫之前都已經成功地顯示了它。

當我嘗試使用AJAX進行呼叫並為TimeTextBox小部件插入新的輸入字段時，它們僅顯示為常規文本框，似乎忽略了我將它們設置為TimeTextBox的事實。

誰能告訴我如何解決此問題？

編輯：這是代碼：

 <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Admin Page</title> <link rel="stylesheet" type="text/css" href="styles/adminPage.css" /> <link rel="stylesheet" type="text/css" href="styles/adminStyle.css" /> <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/resources/dojo.css"> <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dijit/themes/claro/claro.css"> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.2/dojo/dojo.js" djConfig="parseOnLoad:true"></script> <script type="text/javascript"> dojo.require("dojo.parser"); dojo.require("dijit.form.Button"); dojo.require("dijit.form.TimeTextBox"); </script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript"> require(["dojo/ready", "dijit/form/TimeTextBox"], function(ready, TimeTextBox){ ready(function(){ new TimeTextBox({name: "timeInput", value: new Date(), constraints: { timePattern: 'HH:mm:ss', clickableIncrement: 'T00:15:00', visibleIncrement: 'T00:15:00', visibleRange: 'T01:00:00' } }, "timeInput"); }); }); function getPage(page) { $.ajax({ url: "admin"+page+".php", type: "POST", cache: false, success: function (html) { $('#content').html(html); $('#content').fadeIn('slow'); } }); } </script> </head> <body class="claro"> <div id="container"> <div id="header"> <span class="headerTitle">Lehman Nursery</span> </div> <div id="content"> <input type='text' name='date1' id='time1' value='T15:00:00' data-dojo-type='dijit.form.TimeTextBox' required='true' /> </div> <div id="menu"> <a onclick="getPage('Home')"> <div id="homeButton" class="menuAppearance"> <img src="images/icons/home.png"/><br /> </div> </a> <a onclick="getPage('Links')"> <div class="button menuAppearance"> <div class="menuTitle"><img src="images/icons/links.png"/><br />Links</div> <div class="description"> </div> </div> </a> <a onclick="getPage('Hours')"> <div class="button menuAppearance"> <div class="menuTitle"><img src="images/icons/pictures.png"/><br />Pictures</div> <div class="description"> </div> </div> </a> <a onclick=getPage('Events')> <div class="button menuAppearance"> <div class="menuTitle"><img src="images/icons/events.png"/><br />Events</div> <div class="description"> </div> </div> </a> <a onclick=getPage('Feedback')> <div class="button menuAppearance"> <div class="menuTitle"><img src="images/icons/feedback.png"/><br />Feedback</div> <div class="description"> </div> </div> </a> </div> </div> </body>

<form>
    <input type="text" name="date1" id="time1" value="T15:00:00"
    data-dojo-type="dijit/form/TimeTextBox"
    onChange="require(['dojo/dom'], function(dom){dom.byId('val').value=dom.byId('time1').value.toString().replace(/.*1970\s(\S+).*/,'T$1')})"
    required="true" /></form>

^^就是要提取的數據

Answer 1

這些dijit的css文件是否被拉起？ 您可能希望在開始時（頁面加載時） require它們，它們會被緩存，並在通過AJAX拉出dijit時將使用它們。

編輯：不確定，但是可以建議您嘗試為創建的小部件添加startup()調用。

Answer 2

就像您放棄打電話給我一樣：

dojo.parser.parse();

設置內容后，我會調用ajax。 它應該看起來像這樣：

function getPage(page) 
{
$.ajax({
    url: "admin"+page+".php",   
    type: "POST",
    cache: false,
    success: function (html) {              
        $('#content').html(html);
        dojo.parser.parse();
        $('#content').fadeIn('slow');
    }
});
}

dojo解析器本身不會執行，這樣做會花費太多資源，因此每次內容更改時，您都必須添加dijit，您必須調用dojo.parser.parse（）;。

使用AJAX拉入頁面時，Dojo Dijit TimeTextBox不起作用

問題描述

2 個解決方案

解決方案1
0 2012-04-13 15:16:12

解決方案2
0 2012-04-13 15:55:20

使用AJAX拉入頁面時，Dojo Dijit TimeTextBox不起作用

問題描述

2 個解決方案

解決方案1 0 2012-04-13 15:16:12

解決方案2 0 2012-04-13 15:55:20

解決方案1
0 2012-04-13 15:16:12

解決方案2
0 2012-04-13 15:55:20