2010-04-09 20 views
11

मैं निम्नलिखित आवश्यकता वाले टिकट सिस्टम पर काम कर रहा हूं:
होम पेज दो खंडों में विभाजित है:
सेक्शन -1। कुछ फ़िल्टर विकल्प यहां दिखाए जाते हैं। (जैसे बंद टिकट, खुले टिकट, सभी टिकट, टिकट-असाइन-टू-इत्यादि आदि)। आप इनमें से एक या अधिक फ़िल्टर का चयन कर सकते हैं।
सेक -2। फ़िल्टर के ऊपर संतुष्ट टिकटों की सूची यहां प्रदर्शित की जाएगी।यूआरएल योजना यूआरएल योजना

अब यह वही है जो मैं चाहता हूं: जैसा कि मैं फ़िल्टर
-> परिवर्तन यूआरएल में प्रतिबिंबित होना चाहिए, ताकि कोई इसे बुकमार्क कर सके।
-> एक AJAX अनुरोध जाएगा और चयनित फ़िल्टर को संतुष्ट टिकटों की सूची सेक -2 में अपडेट की जाएगी।

मैं एक ही कोड में टिकट लोड करने के लिए इस्तेमाल किया जा करना चाहते हैं दोनों तरीकों
(क) फिल्टर के उस समूह के और चयन करके
(ख) पृष्ठ पुनः लोड करने बुकमार्क का उपयोग करके।

मैं इसे कैसे करना है पर थोड़ा विचार है:
URL चयनित फिल्टर में शामिल होंगे (# के बाद जोड़ा जाता है)
पृष्ठ पर बदलते फिल्टर URL के हैश भाग को संशोधित करने और एक समारोह फोन करेगा (जैसे कि। AJAXHandler()) फ़िल्टर प्राप्त करने के लिए यूआरएल को पार्स करने के लिए और फिर सेक्शन 2 में प्रदर्शित होने वाली टिकटों की सूची प्राप्त करने के लिए अजाक्स अनुरोध करें।
और
मैं उसी कार्य को ajaxHandler() में window.onload में कॉल करूंगा।

मुझे लगता है कि यह Yahoo maps करता है।

ऐसी यूआरएल योजना को लागू करने का सबसे अच्छा तरीका क्या है?
क्या मैं सही दिशा में आगे बढ़ रहा हूं?

+0

जीमेल इस तरह की एक ऐसी सेवा है। कोई अन्य उदाहरण? – Varun

उत्तर

7

हाँ - आप बिल्कुल सही दिशा में आगे बढ़ रहे हैं, और काम का एक टन है जो सभी ब्राउज़रों और ओएस में यह सही ढंग से करने में चला गया है। सही होने के लिए सबसे कठिन भागों में से एक ब्राउज़र के पीछे और आगे बटन को सही ढंग से काम करने में सक्षम बनाता है जब आप उस #urlfragment वाक्यविन्यास का उपयोग कर रहे हैं।

एक पुस्तकालय कि ऐसी बात के लिए सहायता प्रदान करता है: http://developer.yahoo.com/yui/history/

+0

मैं http://www.asual.com/jquery/address/ का उपयोग कर रहा हूं और यह एक आकर्षण के रूप में काम कर रहा है :) – Varun

2

मैं गूगल लहर एप्लिकेशन के समाधान बहुत सुंदर होना करने के लिए लगता है। यह मूल रूप से आप एक पारनीय यूआरएल टुकड़े का उपयोग कर वर्णन करते हैं। इस तरह: http://some.domain/some/url/#filters(filter1:key1,filter2:key2);someOtherfragment;andAnotherFragment

0

इतिहास के लिए यूई लाइब्रेरी का उपयोग करना एक विकल्प है जैसा कि एसब्लॉम की टिप्पणी में उल्लिखित है। आप अपने पृष्ठ पर केवल एक बुकमार्क या लिंक बटन प्रदान करने पर विचार करना चाहते हैं, यदि आप क्रॉस ब्राउज़र संगतता समस्याओं से निपटना नहीं चाहते हैं तो उपयोगकर्ता urk पर जाने के लिए क्लिक कर सकता है।

हम इसे यहां करते हैं http://connect.garmin.com/explore#sortField=relevance&currentPage=1 मानचित्र के शीर्ष पर एक लिंक है।

1

यह कुछ आसान जवाब है, लेकिन जो आप देखना चाहते हैं वह आपके AJAX के लिए एक छिपी आईफ्रेम विधि का उपयोग कर रहा है, एक्सएचआर (एक्सएमएलएचटीपीआरक्वेट ऑब्जेक्ट) के विपरीत। यह ब्राउज़र को इतिहास बनाए रखने की अनुमति देगा, इसलिए आपके बैक बटन काम करना जारी रखेंगे।

कुछ और: http://ajaxpatterns.org/IFrame_Call

2

खैर अगर आप वहाँ asual द्वारा इस सुंदर पुस्तकालय है jQuery का उपयोग कर रहे हैं: डिप लिंक के लिए jQuery Address। उनके पास एक अच्छा एपीआई संदर्भ है, और उदाहरण हैं। यह आपको अपने ऐप को लागू करने के लिए आवश्यक सभी टूल्स देगा।

+0

मैं अब इसका उपयोग कर रहा हूं। धन्यवाद। – Varun

0

क्रोम, सफारी और Firefox में आप एचटीएमएल 5 history.pushState और history.replaceState() तरीकों

कुछ प्रलेखन here और here उपयोग कर सकते हैं।

1

Ben Alman ने BBQ नामक एक पूर्ण-विशेषीकृत jQuery प्लगइन बनाया है। आईएमओ, यह पता प्लगइन से काफी बेहतर है।

संबंधित मुद्दे