दिलचस्प पोस्ट
अस्थायी बिंदु अंकगणित सटीक नतीजे का उत्पादन नहीं करते रीसाइक्लरदृश्य में दृश्यमान आइटम प्राप्त करें कम में संपत्ति के नामों में चर का उपयोग करना (गतिशील गुण / गुण नाम प्रक्षेप) स्पार्क्स का उपयोग कर hbase से कैसे पढ़ा जाए जावास्क्रिप्ट: कई मूल्यों के मुकाबले एक मूल्य की तुलना करने के लिए सबसे सुंदर तरीका फ़ोन सत्यापन regex JavaFX 8 में नामांकित एआरॉग का उद्देश्य क्या है? VBA में मौजूदा कार्यपत्रक का मार्ग कैसे प्राप्त करें? डीपी इकाइयों में एंड्रॉइड और सेटिंग चौड़ाई और ऊंचाई कार्यक्रम क्या कोई जावा रिच टेक्स्ट एडिटर सुझा सकता है? सर्विस स्टैक बनाम एएसपी.नेट वेब एपीआई पायथन में उपयोगकर्ता इनपुट के बाद "नाम: त्रुटि: नाम '' परिभाषित नहीं है ' कैसे पता लगाने के लिए कि .NET रनटाइम का उपयोग किया जा रहा है (एमएस बनाम मोनो)? JQuery: इनपुट फ़ील्ड में परिवर्तन का पता लगाएं मैं पृष्ठ पर कहीं से भी (अन्य) से एक क्लिक के साथ एक ट्विटर बूटस्ट्रैप popover कैसे बंद कर सकता / सकती हूं?

जनक-बाल संबंध के लिए JQuery ग्रिड-सबग्रीड

मुझे कुछ विचार की आवश्यकता है, इस बारे में कि निम्न सांसिरो में एक सबग्रीड कैसे कार्यान्वित करें।

निम्नलिखित जेएसएन डेटा है जिसे मैं जेक्यूएसीई ग्रिड और सबग्रीड में प्रदर्शित करना चाहता हूं। असल में मुझे "संपर्क" नामक ऑब्जेक्ट मिल रहा है जिसे "एक्शनसेट" नामक एक संग्रह है

{ "total" : "10", "page" : "1", "records" : "78", "rows" : [ { "comment" : null, "givenName" : "Contact A", "familyName" : "A", "actionSet" : [ { "actionID" : 1, "actionDueDate" : "2012-12-08", "actionNote" : "Action 1" }, { "actionID" : 2, "actionDueDate" : "2012-12-08", "actionNote" : "Action 2" } ] } ...] } 

मुझे "संपर्क" और ग्रिड के साथ जुड़े उपग्रीस को प्रदर्शित करने के लिए गहराई ग्रिड पंक्ति चाहिए, "actionset" संग्रह को प्रदर्शित करना चाहिए

जब ग्रिड में किसी विशेष पंक्ति का चयन किया जाता है, तो मैं संबंधित कार्यों को प्राप्त करने के लिए एक सर्वर कॉल नहीं करना चाहता, क्योंकि वे "एक्शनसेट" में मौजूद हैं

मुझे ग्रिड काम मिल रहा है, "संपर्क" को अच्छी तरह से प्रदर्शित किया गया है, लेकिन उपग्रीड को कार्यान्वित करते समय मुझे उलझन में मिलता है, जैसा कि इसके लिए डेटा प्राप्त करना है, क्योंकि यह पूरी तरह से जेएसएन में उपलब्ध है।

 jq(function() { jq("#grid").jqGrid({ url:'/smallworks/project/getall.do', datatype: 'json', mtype: 'GET', colNames:['Id', 'First Name', 'Last Name'], colModel:[ {name:'id',index:'id', width:55,editable:false,editoptions: {readonly:true,size:10},hidden:true}, {name:'givenName',index:'givenName', width:100,editable:true, editrules:{required:true}, editoptions:{size:10}}, {name:'familyName',index:'familyName', width:100,editable:true, editrules:{required:true}, editoptions:{size:10}} ], postData: { }, rowNum:20, rowList:[20,40,60], height: 200, autowidth: true, rownumbers: true, pager: '#pager', sortname: 'id', viewrecords: true, sortorder: "asc", caption:"Contacts", emptyrecords: "Empty records", loadonce: false, loadComplete: function() { }, 

क्या यह प्राप्त है? क्या मुझे उप-ग्रिड के लिए विशेष रूप से JSON डेटा को पार्स करने की आवश्यकता है? यह कैसे हासिल किया जा सकता है?

वेब के समाधान से एकत्रित समाधान "जनक-बाल संबंध के लिए JQuery ग्रिड-सबग्रीड"

मेरा सुझाव है कि आप actionSet से जानकारी को बचाने के लिए किसी ऑब्जेक्ट में सेट करें जिसे आप आसानी से बाद में एक्सेस कर सकते हैं उदाहरण के लिए आप userData पैरामीटर का उपयोग कर सकते हैं और पहले beforeProcessing अंदर JSON डेटा के beforeProcessing डेटा भाग को भर सकते हैं। उपग्रिड बनाएं, आप उत्तर या किसी अन्य का अनुसरण कर सकते हैं।

डेमो कार्यान्वयन के दृष्टिकोण का प्रदर्शन करता है:

यहां छवि विवरण दर्ज करें

यह निम्न कोड का उपयोग करता है

 var mainGridPrefix = "s_"; $("#grid").jqGrid({ url: "Adofo.json", datatype: "json", colNames: ["First Name", "Last Name"], colModel: [ { name: "givenName" }, { name: "familyName" } ], cmTemplate: {width: 100, editable: true, editrules: {required: true}, editoptions: {size: 10}}, rowNum: 20, rowList: [20, 40, 60], pager: "#pager", gridview: true, caption: "Contacts", rownumbers: true, autoencode: true, height: "100%", idPrefix: mainGridPrefix, subGrid: true, jsonReader: { repeatitems: false }, beforeProcessing: function (data) { var rows = data.rows, l = rows.length, i, item, subgrids = {}; for (i = 0; i < l; i++) { item = rows[i]; if (item.actionSet) { subgrids[item.id] = item.actionSet; } } data.userdata = subgrids; }, subGridRowExpanded: function (subgridDivId, rowId) { var $subgrid = $("<table id='" + subgridDivId + "_t'></table>"), pureRowId = $.jgrid.stripPref(mainGridPrefix, rowId), subgrids = $(this).jqGrid("getGridParam", "userData"); $subgrid.appendTo("#" + $.jgrid.jqID(subgridDivId)); $subgrid.jqGrid({ datatype: "local", data: subgrids[pureRowId], colNames: ["Due Date", "Note"], colModel: [ { name: "actionDueDate", formatter: "date", sorttype: "date" }, { name: "actionNote" } ], sortname: "actionDueDate", height: "100%", rowNum: 10000, autoencode: true, autowidth: true, jsonReader: { repeatitems: false, id: "actionID" }, gridview: true, idPrefix: rowId + "_" }); } }); 

नवीनीकृत : डेमो में इस्तेमाल किया जाने वाला JSON डेटा नीचे देख सकता है। मैंने id संपत्ति जो jqGrid के लिए जरूरी है जोड़ा मैंने actionID को actionID के id के रूप में उपयोग किया था:

 { "total": "10", "page": "1", "records": "78", "rows": [ { "id": 10, "comment": null, "givenName": "Contact A", "familyName": "A", "actionSet": [ { "actionID": 1, "actionDueDate": "2012-12-08", "actionNote": "Action 1" }, { "actionID": 2, "actionDueDate": "2012-12-09", "actionNote": "Action 2" } ] }, { "id": 20, "comment": null, "givenName": "Contact B", "familyName": "B", "actionSet": [ { "actionID": 3, "actionDueDate": "2012-12-11", "actionNote": "Action 3" }, { "actionID": 4, "actionDueDate": "2012-12-10", "actionNote": "Action 4" } ] } ] }