TAILIEUCHUNG - Practical prototype and scipt.aculo.us part 50

Practical prototype and part 50: The information in this book is distributed on an "as is" basis, without warranty Although every pre-caution has been taken in the preparation of this work, neither the author(s) nor Apress shall have any liability to any person or entity with respect to any loss or damage caused or alleged to be caused directly or indirectly by the information contained in this work. | CHAPTER 12 ADVANCED CONTROLS AUTOCOMPLETERS IN-PLACE EDITORS AND SLIDERS 291 Figure 12-7. The in-place editor s edit mode Making It Pretty Astute readers will have already noticed that an hl element looks much different from a text box with the same text content. We can fix that quite easily with CSS. Click the in-place editor to put it into edit mode once again then use Firebug to inspect the text box that appears. With the Firebug pane visible click Inspect and then click in the text box. The HTML inspector shows us that the input element has a class name of editor_field and that its form parent node has an ID of team_name-inplaceeditor in other words it adds -inplaceeditor to the ID of the original element. Armed with this information we can write a CSS selector that targets both read mode and edit mode. Add this to the style element in your document s head h1 team_name form team_name-inplaceeditor .editor_field font-size 19px font-weight bold 292 CHAPTER 12 ADVANCED CONTROLS AUTOCOMPLETERS IN-PLACE EDITORS AND SLIDERS Now the element looks the same in either mode as shown in Figure 12-8. Maintaining the text s styling helps the user navigate a new and perhaps unfamiliar UI pattern. Figure 12-8. The read mode on the left and the edit mode on the right are now far less disjointed-looking resulting in a friendlier user interface. Common Options and Features is like its brethren endlessly configurable. Here are some of the most useful options okButton and okText control the display of the button that submits the value to the server. Setting okButton to false hides the button altogether the form can only be submitted via the Enter key. The okText parameter which defaults to ok lets you change the label of the button . Save Go or Make it Happen . cancelLink and cancelText control the display of the link that cancels the edit operation. Setting cancelLink to false hides the link. The cancelText parameter lets you change the label

• Kỹ thuật lập trình
• Phương pháp lập trình
• lập trình website
• các bước cơ bản khi lập trình
• công thức lập trình web
• thao tác khi lập trình
• Phương pháp lập trình hướng đối tượng
• Lập trình hướng đối tượng
• Bài giảng Lập trình hướng đối tượng
• Bài tập lập trình hướng đối tượng
• Bài giảng Phương pháp lập trình
• Quy tắc chuyển đổi
• Ngôn ngữ lập trình
• Kiểu dữ liệu
• Kỹ thuật lập trình
• Kiểu lập trình
• Lập trình thủ tục
• lập trình căn bản
• lập trình java
• kỹ thuật máy tính
• thủ thuật lập trình
• kinh nghiệm lập trình
• lập trình đối tượng
• tài liệu lập trình
• lập trình mạng máy tính
• chuyên ngành lập trình
• Ngôn ngữ lập trình C
• Học lập trình C
• Lý thuyết lập trình
• Ngôn ngữ lập trình C C++
• Tự học lập trình
• Học lập trình
• Chuỗi ký tự lập trình
• Lập trình C#
• Phương pháp lập trình cổ điển
• Cấu trúc điều khiển
• Biến dối tượng
• Xử lý dữ liệu
• bài tập phương pháp lập trình
• mẹo lập trình
• Lớp và đối tượng
• Lập trình hướng thủ tục
• Chương trình vẽ uml
• code lập trình
• kỹ thuật phần mềm
• chương trình lập trình
• giáo trình lập trình
• bài giảng lập trình C++
• phương pháp lập trình cấu trúc
• phép tham chiếu
• Bài giảng Nguyên lý và phương pháp lập trình
• Nguyên lý và phương pháp lập trình
• Kiểm chứng tính đúng đắn
• Lập trình có cấu trúc
• Tổng quan các ngôn ngữ lập trình