2014-05-10 29 views
0

我有一個窗體,其中的小部件使用聲明性語法進行安裝。Dojo。如何在表單元素中添加屬性?

<script> 
require(["dojo/parser", 
    "dijit/form/Form", 
    "dijit/form/Button", 
    "dijit/form/ValidationTextBox", 
    "dijit/form/DateTextBox" , 
    "dojox/validate/web", 
    "dojox/form/PasswordValidator", 
    "dijit/form/FilteringSelect" , 
    "dijit/form/Button", 
    "dijit/form/Select", 
    "dojo/dom", 
    "dojo/dom-attr" 

]); 

<div data-dojo-type="dijit/form/Form" id="signupForm" data-dojo-id="signupForm" 
    encType="multipart/form-data" action="" method=""> 
    <input type='hidden' name='csrfmiddlewaretoken' value='xxxxxxxxxxxx' /> 

     <label for="id_username">Username:</label> 
     <input autofocus="autofocus" data-dojo-type="dijit/form/ValidationTextBox" id="id_username" maxlength="30" name="username" placeholder="Username" type="text" /> 

這種形式從Django模板內置,我想用它顯示了日,月和一年三隻小部件Django的SelectDateWidget。問題在於無法在模板中單獨顯示這些字段。在加載到瀏覽器中後,我必須添加dojo屬性。類似於

<script> 
    dojo.attr(dom.byId("id_birth_date_month"), {data-dojo-type:"dijit/form/Select", data-dojo-id:"monthSelect"}); 
    dojo.attr(dom.byId("id_birth_date_year"), {data-dojo-type:"dijit/form/Select", data-dojo-id:"monthSelect"}); 
</script> 

上述場外行爲不起作用。我該怎麼做?

回答

1

我發現了兩種方法可以做到這一點。我希望他們幫助別人。

首先道場方式

<script> 
    require(["dojo/parser", 
    "dijit/form/Select", 
    "dojo/dom"], function (parser, Select, dom) { 
     dojo.attr(dom.byId("id_birth_date_month"), {"data-dojo-type":dijit/form/Select",  
                "data-dojo-id": "monthSelect"}); 
    // similar lines for day and year 
    }); 
</script> 

    <!-- ...later in the code--> 
    <select id="id_birth_date_month"> 
    ... 
    </select> 

    <!-- two other similar selects for day and year--> 

這是它是一個浮動窗格所以parser.parse內加載的形式()等已經運行。我不確定解析完成後聲明式語法爲什麼起作用,但這種方法奏效。

第二種方法是從Django。在表單字段本身中定義屬性。這是我採取的方法。

class SignupForm(Form): 

# other form fields 
    birth_date = DateField(widget=SelectDateWidget(years=range(yearNow - 13, yearNow - 100, -1),attrs={"data-dojo-type": "dijit/form/Select", "data-dojo-id": "birthDateSelect"}), required=True, initial="", label=_('Birth Date')) 
# other form fields 

不幸的是,所有三個字段(年,月)獲得相同的數據dojo-id,我不知道這是否是一個問題。目前它工作,我沒有看到任何奇怪的東西。

相關問題