Clickable võ đường nhãn

Question

Nếu bạn đang sử dụng đầu vào hình thức võ đường và muốn có nhãn cho họ như thế:

<label for="???">Email</label> 
<input 
    type="text" 
    name="email" 
    dojoAttachPoint="email" 
    dojoType="dijit.form.TextBox" 
/> 

nhãn là không thể nhấp, vì không có cách nào để biết id của input trước nó được trả lại.

Có tồn tại một giải pháp nào khác ngoài việc hack một id trong dojo tạo ra cho phần tử đó không?

CẬP NHẬT

Nó thực sự thậm chí khó khăn hơn tôi nghĩ, vì lĩnh vực đầu vào trong võ đường được kết xuất như

<div class="dijit dijitTextBox" id="widget_dijit_form_TextBox_0"> 
    <input class="dijitReset dijitInputField" value="Χ" type="text" tabindex="-1"> 
    ... 
</div> 

và lĩnh vực đầu vào cơ bản không có một id

Answer 1

Bạn đã thử đưa id vào đầu vào chưa?

<label for="myIdComesHere">Email</label> 
<input 
    id="myIdComesHere" 
    type="text" 
    name="email" 
    dojoAttachPoint="email" 
    dojoType="dijit.form.TextBox" 
/> 

---

Nếu tôi nhớ chính xác, id này có thể được sử dụng cả hai bởi dojo.byId (để lấy domNode aka thẻ đầu vào) và bởi dijit.byId (để lấy dijit Widget chẳng hạn)

Answer 2

Nếu bạn đang tạo biểu mẫu bên trong một tiện ích, bạn có thể sử dụng this.id để lấy id của phiên bản đó của tiện ích.

Nếu tiện ích của bạn được gọi là my.form, ID của tiện ích con sẽ là my_form_0 và sẽ tăng cho mỗi tiện ích con biểu mẫu mới được tạo.

Để tạo một ID duy nhất cho các yếu tố hình thức của bạn, sử dụng

var id = this.id + '_email'; 

'<label for="' + id + '"/>' 
'<input type="text" id="' + id + '"/>' 

Điều đó sẽ cung cấp cho bạn

<label for="my_form_0_email"/> 
<input type="text" id="my_form_0_email"/> 

Nếu bạn đang tạo đầu vào bằng cách sử dụng dijit.form.TextBox, hộp đó LUÔN LUÔN sẽ có một ID duy nhất trên trang của bạn. Phần tử dom <input> thực tế bên trong tiện ích sẽ có ID được tìm thấy bằng cách lấy ID của tiện ích con.

Nếu bạn tạo TextBox programatically, bạn có thể làm như sau:

var tb = new dijit.form.TextBox(), 
    label = dojo.create("label", {for: tb.id}); 

Answer 3

Nếu bạn không quan tâm đến khả năng tương thích với IE, bạn có thể đặt vào bên trong nhãn:

<label><input type=checkbox>hello</label>