दिलचस्प पोस्ट
इंटरनेट एक्सप्लोरर कुछ डोमेन पर कुकीज़ की उपेक्षा करता है (कुकीज़ को पढ़ा या सेट नहीं किया जा सकता है) NHibernate के साथ एक-से-कई मानचित्रण करने का न्यूनतम और सही तरीका ओपनजीएल ES में टेक्स्ट को ड्रा करें दुविधा: फ्रैगमेंट बनाम क्रियाकलापों का उपयोग करने के लिए: सी # में कॉओरिएंट और कॉन्ट्राएरिएन्ट इंटरफेस को समझना एंड्रॉइड में कैसे कैनवास द्वारा सर्कल खींचें? अकाका के लिए अच्छा उपयोग केस आईओएस 7 आईपैड सफारी लैंडस्केप इनरहइट / बाहरी हाइट लेआउट इश्यू CSS3 की सीमा-त्रिज्या संपत्ति और सीमा-पतन: पतन मिश्रण नहीं है। गोल कोनों के साथ एक संक्षिप्त तालिका बनाने के लिए मैं सीमा-त्रिज्या का उपयोग कैसे करूं? एंड्रॉइड: फ़ोकस एक संपादन टेक्स्ट पर है, तो स्वचालित रूप से नरम कीबोर्ड दिखाएं मैं फ़ायरफ़ॉक्स में एक फ़ाइल इनपुट फ़ील्ड कैसे शैली कर सकता हूं? JavaFX 2.1: टूलकिट को आरम्भ नहीं किया गया "SET NAMES" का उपयोग करना चाहे गैर-स्थिर क्षेत्र तक पहुंच नहीं सकते हैं ग्रैडल बिल्डस्क्रिप्ट निर्भरताएं

रेंगमेंट यूआरएल के साथ जेकग्रीड की इनलाइन-संपादन का उपयोग करना?

मैं jqGrid का उपयोग कर रहा हूं और एजेक्स को जोड़ने / संपादित करने / हटाने के लिए कॉल करने के लिए अपने अंतर्निहित संपादन कार्य का उपयोग करने में सक्षम होना चाहता हूं। हमारी एपीआई रिक्त वर्बल्स और यूआरएल का उपयोग करती है:

verb url action -------------------------------------------------------------- GET /api/widgets get all widgets (to populate grid) POST /api/widgets create new widget PUT /api/widgets/1 update widget 1 DELETE /api/widgets/1 delete widget 1 

क्या इन प्रतिबंधों के साथ अंतर्निर्मित एजेक्स हैंडलिंग का उपयोग करना संभव है, या क्या मुझे स्थानीय डेटा का उपयोग करना है (जैसा कि यहां तथा यहां पर उल्लिखित किया गया है ) और अपने आप को एजेक्स कॉल करने का प्रबंध करता है? यदि यह संभव है, तो ग्रिड पर मैं क्या गुण सेट करता हूं?

( ajaxRowOptions आशाजनक दिखता है, लेकिन दस्तावेज़ इसका उपयोग करने के तरीके पर थोड़ा पतला है।)

वेब के समाधान से एकत्रित समाधान "रेंगमेंट यूआरएल के साथ जेकग्रीड की इनलाइन-संपादन का उपयोग करना?"

POST का उपयोग प्रपत्र में डिफ़ॉल्ट रूप से होता है

RESTfull बैकएंड के लिए jqGrid को अनुकूलित करने का मुख्य विचार आप पुराने उत्तर में पा सकते हैं।

यदि आप नेविगेटर टूलबार के हटाए गए बटन का उपयोग करते हैं तो फॉर्म संपादन में 'DELETE' का उपयोग करने के लिए यहाँ या यहाँ देखें तो आपको निम्न सेटिंग्स के बारे में उपयोग करना चाहिए:

 $("#grid").jqGrid('navGrid', '#pager', {edit: false, add: false, search: false}, {}, {}, { // Delete parameters mtype: "DELETE", serializeDelData: function () { return ""; // don't send and body for the HTTP DELETE }, onclickSubmit: function (params, postdata) { params.url = '/api/widgets/' + encodeURIComponent(postdata); } }); 

मैं एनकोडयूआरआईकॉन्मेंट फ़ंक्शन के ऊपर उदाहरण में इसका उपयोग करने के लिए सुनिश्चित करता हूं कि यदि आईडी में कुछ विशेष वर्ण होंगे (उदाहरण के लिए रिक्त स्थान) अगर एन्कोड किया जाएगा ताकि सर्वर पार्ट स्वतः मूल (डीकोडेड) डेटा प्राप्त कर सके। संभवतः आपको सर्वर के लिए अनुरोध को हटाने के दौरान $.ajax कॉल के लिए कुछ अतिरिक्त सेटिंग्स सेट करने की आवश्यकता होगी। आप इसके लिए ajaxDelOptions संपत्ति का उपयोग कर सकते हैं।

आप अपनी डिफ़ॉल्ट सेटिंग्स के रूप में उपरोक्त सेटिंग्स बना सकते हैं। आप इसे निम्नलिखित के संबंध में कर सकते हैं

 $.extend($.jgrid.del, { mtype: "DELETE", serializeDelData: function () { return ""; // don't send and body for the HTTP DELETE }, onclickSubmit: function (params, postdata) { params.url = '/api/widgets/' + encodeURIComponent(postdata); } }); 

उपरोक्त उदाहरण से onclickSubmit की गई विधि को गतिशील रूप से /api/widgets/1 यूआरएल को संशोधित करने के लिए संपादन प्रचालन (प्रपत्र संपादन के मामले में) के लिए इस्तेमाल किया जा सकता है कई मामलों में उपरोक्त फॉर्म में onclickSubmit का उपयोग संभव नहीं है क्योंकि एक को अलग आधार यूआरएल ( '/api/widgets' ) का उपयोग करने की जरूरत है। मामले में कोई भी उपयोग कर सकता है

 $.extend($.jgrid.del, { mtype: "DELETE", serializeDelData: function () { return ""; // don't send and body for the HTTP DELETE }, onclickSubmit: function (params, postdata) { params.url += '/' + encodeURIComponent(postdata); } }); 

इसके बाद navGrid का url की स्पष्ट सेटिंग के साथ होना चाहिए

 $("#grid").jqGrid('navGrid', '#pager', {edit: false, add: false, search: false}, {}, {}, { // Delete parameters url: '/api/widgets' }); 

और इनलाइन संपादन में 'PUT' का उपयोग करने के लिए आप निम्न डिफ़ॉल्ट jqGrid सेटिंग सेट कर सकते हैं:

 $.extend($.jgrid.defaults, { ajaxRowOptions: { contentType: "application/json", type: "PUT", async: true }, serializeRowData: function (data) { var propertyName, propertyValue, dataToSend = {}; for (propertyName in data) { if (data.hasOwnProperty(propertyName)) { propertyValue = data[propertyName]; if ($.isFunction(propertyValue)) { dataToSend[propertyName] = propertyValue(); } else { dataToSend[propertyName] = propertyValue; } } } return JSON.stringify(dataToSend); } }); 

सेटिंग contentType: "application/json" सामान्य रूप से आवश्यक नहीं है, लेकिन कुछ सर्वर प्रौद्योगिकियों के लिए यह आवश्यक हो सकता है कॉलबैक फ़ंक्शन serializeRowData उदाहरण के ऊपर डेटा को JSON के रूप में डेटा भेजा गया। यह RESTfull के लिए आवश्यक नहीं है, लेकिन यह बहुत आम है। फ़ंक्शन JSON.stringify मूल रूप से हाल के वेब ब्राउज़र में कार्यान्वित किया गया है, लेकिन यह सुनिश्चित करने के लिए कि यह पुराने ब्राउज़र में काम करता है, आपको अपने पृष्ठ पर json2.js को शामिल करना चाहिए।

serializeRowData का कोड बहुत आसान हो सकता है जैसे

 serializeRowData: function (data) { return JSON.stringify(data); } 

लेकिन मैं विधि editRow के extraparam के अंदर फ़ंक्शन का उपयोग करने में सक्षम होने के लिए ऊपर कोड का उपयोग करता हूं ( यहां और यहां समस्या का विवरण देखें)।

editRow में RESTfull यूआरएल (जैसे /api/widgets/1 ) का उपयोग बहुत सरल है:

 $(this).editRow(rowid, true, null, null, '/api/widgets/' + encodeURIComponent(rowid)); 

प्रपत्र संपादन के मामले में इसका उपयोग करने के लिए आपको उपयोग करना चाहिए

 grid.navGrid('#pager', {}, { mtype: "PUT", url: '/api/widgets' }); 

तथा

 $.extend($.jgrid.edit, { ajaxEditOptions: { contentType: "application/json" }, // can be not required onclickSubmit: function (params, postdata) { params.url += '/' + encodeURIComponent(postdata.list_id); } }); 

यह टिप्पणी करने के लिए महत्वपूर्ण है कि postdata अंदर postdata से id प्राप्त करने और postdata.list_id बजाय postdata.list_id उपयोग करने की postdata.id , जहां 'list' ग्रिड का आईडी है विभिन्न ग्रिड ( <table> ) आईडी का प्रयोग करने में सक्षम होने के लिए नए गैर-मानक पैरामीटर का उपयोग कर सकते हैं। उदाहरण के लिए, नीचे दिए गए कोड में मैं myGridId उपयोग करता myGridId :

 var myEditUrlBase = '/api/widgets'; grid.navGrid('#pager', {}, { mtype: "PUT", url: myEditUrlBase, myGridId: 'list' }, { // Add options url: myEditUrlBase }, { // Delete options url: myEditUrlBase }); 

और डिफ़ॉल्ट सेटिंग के रूप में परिभाषित

 $.extend($.jgrid.del, { mtype: "DELETE", serializeDelData: function () { return ""; // don't send and body for the HTTP DELETE }, onclickSubmit: function (params, postdata) { params.url += '/' + encodeURIComponent(postdata); } }); $.extend($.jgrid.edit, { ajaxEditOptions: { contentType: "application/json" }, // can be not required onclickSubmit: function (params, postdata) { params.url += '/' + encodeURIComponent(postdata[params.myGridId + '_id']); } }); 

फॉर्मेटर के उपयोग के मामले में : 'क्रियाएं' (इनके साथ यहां और यहां देखें) संपादन या फॉर्मेट (या मिश्रण) के साथ आप उसी तकनीक का उपयोग कर सकते हैं जैसा कि पहले बताया गया है, लेकिन सभी आवश्यक संपादित करें / हटाएं विकल्प का उपयोग करें संपादन विकल्प और delOptions स्वरूपण विकल्प ।

आपका अंतिम प्रश्न /api/widgets रूप में GET का प्रयोग था। क्लासिकल रीस्टफुल सेवाएं सभी आइटमों की सरणी को केवल /api/widgets पर प्रतिक्रिया के रूप में /api/widgets । तो आपको बस loadonce: true उपयोग करना चाहिए loadonce: true और jsonReader जो गुणों के बजाय विधियों का इस्तेमाल करते हैं (देखें यहां और यहां )।

 loadonce: true, jsonReader: { repeatitems: false, root: function (obj) { return obj; }, page: function () { return 1; }, total: function () { return 1; }, records: function (obj) { return obj.length; } } 

आपको कुछ रास्ते में जानकारी शामिल करना चाहिए जिसमें ग्रिड पंक्तियों के आईडी के रूप में उपयोग किया जा सकता है आईडी पृष्ठ पर unique होना चाहिए। यह आपके डेटा में कोई आईडी नहीं है जो मैं आपको उपयोग करने के लिए सुझाएगा

 id: function () { return $.jgrid.randId(); } 

एक अतिरिक्त jsonReader विधि के रूप में क्योंकि प्रति डिफ़ॉल्ट के लिए jqGrid के वर्तमान संस्करण अनुक्रमिक पूर्णांक ("1", "2", "3", …) पंक्ति आईडी के रूप में उपयोग करते हैं एक ही पृष्ठ पर कम से कम दो ग्रिड होने की स्थिति में यह समस्याओं का पालन करेगी।

यदि 'GET' द्वारा प्राप्त आंकड़ों का आकार अधिक से अधिक 100 पंक्तियाँ हैं, तो आप सर्वर पक्ष पेजिंग का उपयोग करने के लिए बेहतर सुझाव देंगे। इसका मतलब है कि आप सर्वर पार्ट में एक अतिरिक्त विधि जोड़ देंगे, जो डेटा के साइड सॉर्टिंग और पेजिंग का समर्थन करता है। मैं आपको उस जवाब को पढ़ने के लिए सुझाता हूं जहां मैंने बताया कि इनपुट डेटा का मानक प्रारूप आइटमों का सरणी नहीं है और उसमें page , total और अतिरिक्त records । नई पद्धति शास्त्रीय शास्त्रीय डिजाइन के लिए शायद अजीब नहीं होगी, लेकिन देशी या यहां तक ​​कि एसक्यूएल कोड में सॉर्टिंग और पेजिंग डेटा नाटकीय ढंग से एंडयूसर के किनारे से कुल प्रदर्शन को सुधार सकता है। यदि मानक jqGrid इनपुट पैरामीटर ( page , rows , sidx और sord ) के नाम आप वहां नाम बदलने के लिए prmNames jqGrid पैरामीटर का उपयोग कर सकते हैं।

इसके अलावा इस उत्कृष्ट सामान्य ट्यूटोरियल को देखने के लिए कि कैसे यूआरएल के रीसेट यूआरएल के लिए जेकग्रीड को सेट अप करना है , जिसमें यह भी शामिल है कि इसी स्प्रिंग एमवीसी सर्वर का भाग कैसे दिखता है।

मैंने इसे एसयूएमटीसीएल इवेंट हैंडलर से पहले कार्यान्वित करके हासिल किया है:

 beforeSubmitCell: function(rowId) { jQuery("#grid-HumanResource-table").jqGrid( 'setGridParam', { cellurl: s.getBaseModule().config.baseAPIUrl + "humanResource/" + rowId } ); }, 

मैं jqGrid 4.6 संस्करण का उपयोग कर रहा हूँ।