फ्रेमवर्क 7 - संदेश बार

विवरण

फ्रेमवर्क 7 एप्लिकेशन में मैसेजिंग सिस्टम के साथ काम करने के लिए विशेष रेज़िबल टूलबार प्रदान करता है।

निम्न कोड संदेश बार लेआउट दिखाता है -

<div clas = "toolbar messagebar">
   <div clas = "toolbar-inner">
      <textarea placeholder = "Message"></textarea>
      <a href = "#" clas = "link">Send</a>
   </div>
</div>

संदेश पट्टी में, "पेज" के अंदर बहुत महत्वपूर्ण है और "संदेश-सामग्री" के दाईं ओर है -

<div class = "page toolbar-fixed">
   <!-- messagebar -->
   <div class = "toolbar messagebar">
      <div class = "toolbar-inner">
         <textarea placeholder = "Message"></textarea>
         <a href = "#" class = "link">Send</a>
      </div>
   </div>
   
   <!-- messages-content -->
   <div class = "page-content messages-content">
      <div class = "messages">
         ... messages
      </div>
   </div>
</div>

आप जावास्क्रिप्ट के साथ संदेश पट्टी को आरंभ करने के लिए निम्नलिखित विधि का उपयोग कर सकते हैं -

myApp.messagesbar(messagesbarContainer, parameters)

विधि के दो विकल्प हैं -

• messagesbarContainer - यह एक आवश्यक एचटीएमएल तत्व या स्ट्रिंग है जिसमें मैसेजबार कंटेनर एचटीएमएल तत्व शामिल है।

• parameters - यह मैसेजबार पैरामीटर के साथ एक ऑब्जेक्ट निर्दिष्ट करता है।

उदाहरण के लिए -

var myMessagebar = app.messagebar('.messagebar', {
   maxHeight: 200
});

मैसेजबार पैरामीटर

maxHeight- इसका उपयोग टेक्स्टारिया की अधिकतम ऊंचाई निर्धारित करने के लिए किया जाता है और इसके पाठ की मात्रा के आधार पर इसे आकार दिया जाएगा। पैरामीटर का प्रकार संख्या है और डिफ़ॉल्ट मान शून्य है ।

मैसेजबार गुण

निम्न तालिका संदेश पट्टी गुण दिखाती है -

S.No	गुण और विवरण
1	myMessagebar.params आप ऑब्जेक्ट को प्रारंभिक आरंभीकरण मापदंडों के साथ निर्दिष्ट कर सकते हैं।
2	myMessagebar.container आप मैसेजबार कंटेनर HTML तत्व के साथ डोम 7 तत्व निर्दिष्ट कर सकते हैं।
3	myMessagebar.textarea आप messagebar textarea HTML तत्व के साथ डोम 7 तत्व निर्दिष्ट कर सकते हैं।

मैसेजबार के तरीके

निम्न तालिका संदेश पट्टी के तरीकों को दिखाती है -

S.No	तरीके और विवरण
1	myMessagebar.value(newValue); यह संदेश पट्टी textarea मान / पाठ सेट करता है और संदेश पट्टी textarea मान देता है, यदि newValue निर्दिष्ट नहीं है।
2	myMessagebar.clear(); यह textarea को साफ़ करता है और आकार को अपडेट / रीसेट करता है।
3	myMessagebar.destroy(); यह संदेश पट्टी उदाहरण को नष्ट कर देता है।

HTML के साथ Messagebar को इनिशियलाइज़ करें

आप .messagebar में messagebar-init वर्ग को जोड़कर जावास्क्रिप्ट विधियों और गुणों के बिना HTML का उपयोग करके मैसेजबार को इनिशियलाइज़ कर सकते हैं और आप डेटा- एट्रीब्यूट्स का उपयोग करके आवश्यक पैरामीटर पास कर सकते हैं ।

निम्न कोड HTML के साथ मैसेजबार के आरंभ को निर्दिष्ट करता है -

<div class = "toolbar messagebar messagebar-init" data-max-height = "200">
   <div class = "toolbar-inner">
      <textarea placeholder = "Message"></textarea>
      <a href = "#" class = "link">Send</a>
   </div>
</div>

मैसेजबार के इंस्टेंस तक पहुंच

यदि आप HTML का उपयोग करके इसे आरंभ करते हैं, तो संदेश बार उदाहरण तक पहुँचना संभव है; यह अपने कंटेनर तत्व के f7 संदेश बार गुण का उपयोग करके प्राप्त किया जाता है ।

var myMessagebar = $$('.messagebar')[0].f7Messagebar;
// Now you can use it
myMessagebar.value('Hello world');

आप Messagebar का उदाहरण देख सकते हैं, जिसे इस लिंक में समझाया गया है