एक ही समय में नियंत्रक को फॉर्म डेटा और jqGrid (editUrl) डेटा को पास करने के लिए कैसे करें

Question

मेरे पास फॉर्म डेटा के विभिन्न बिट्स और एक jqGrid के साथ एएसपीनेट एमवीसी 3 ऐप है।

जब मैं jqGrid में एक पंक्ति संपादित करता हूं तो मुझे ग्रिड डेटा के साथ-साथ कुछ फॉर्म टुकड़े को संपादन यूआरएल नियंत्रक को पोस्ट करने की आवश्यकता होती है।

मैं jqGrid संपादित डेटा को मेरे नियंत्रक को editUrl के माध्यम से ठीक से पोस्ट कर सकता हूं।

क्या ऐसा करने का कोई तरीका है?

मुझे यकीन नहीं है कि अन्य फॉर्म तत्व कैसे भेजें और उन्हें मेरे नियंत्रक में कैसे प्राप्त करें।

किसी भी मदद की सराहना की जाएगी।

नीचे मेरी jqGrid है:

$("#jqTable").jqGrid({ 
     // Ajax related configurations 
     url: '@Url.Action("_CustomBinding")', 
     datatype: "json", 
     mtype: "POST", 
     postData: { 
      programID: function() { return $("#ProgramID option:selected").val(); }, 
      buildID: function() { return $('#Builds option:selected').val(); } 
     }, 

     // Specify the column names 
     colNames: ["Actions", "Assembly ID", "Assembly Name", "Assembly Type", "Cost", "Order", "Budget Report", "Partner Request", "Display"], 

     // Configure the columns 
     colModel: [ 
     { name: 'myac', width: 80, fixed: true, sortable: false, resize: false, formatter: 'actions', formatoptions: { keys: true} }, 
     { name: "AssemblyID", key: true, index: "AssemblyID", width: 40, align: "left", editable: false }, 
     { name: "AssemblyName", index: "AssemblyName", width: 100, align: "left", editable: true, edittype: 'select', 
      editoptions: { 
       dataUrl: '@Url.Action("_Assemblies")', 
       buildSelect: function (data) { 
        var response = jQuery.parseJSON(data); 
        var s = '<select>'; 
        if (response && response.length) { 
         for (var i = 0, l = response.length; i < l; i++) { 
          var ri = response[i]; 
          s += '<option value="' + ri + '">' + ri + '</option>'; 
         } 
        } 
        return s + "</select>"; 
       } 
      } 
     }, 
     { name: "AssemblyTypeName", index: "AssemblyTypeName", width: 100, align: "left", editable: false, edittype: 'select' }, 
     { name: "AssemblyCost", index: "AssemblyCost", width: 50, align: "left", formatter: "currency", editable: true }, 
     { name: "AssemblyOrder", index: "AssemblyOrder", width: 50, align: "left", editable: true }, 
     { name: "AddToBudgetReport", index: "AddToBudgetReport", width: 100, align: "center", formatter: "checkbox", editable: true, edittype: 'checkbox' }, 
     { name: "AddToPartnerRequest", index: "AddToPartnerRequest", width: 100, align: "center", formatter: "checkbox", editable: true, edittype: 'checkbox' }, 
     { name: "Show", index: "Show", width: 50, align: "center", formatter: "checkbox", editable: true, edittype: 'checkbox'}], 

     // Grid total width and height and formatting 
     //width: 650, 
     //height: 220, 
     altrows: true, 

     // Paging 
     //toppager: true, 
     pager: $("#jqTablePager"), 
     rowNum: 10, 
     rowList: [10, 20, 30], 
     viewrecords: true, // Specify if "total number of records" is displayed 
     emptyrecords: 'No records to display', 

     // Default sorting 
     sortname: "AssemblyID", 
     sortorder: "asc", 

     // Grid caption 
     caption: "Build Template", 

     // grid command functionality 
     editurl: '@Url.Action("_AjaxUpdate")', 
     onSelectRow: function (AssemblyID) { 
      if (AssemblyID && AssemblyID !== lastsel) { 
       $('#jqTable').jqGrid('restoreRow', lastsel); 
       $("#jqTable").jqGrid('editRow', AssemblyID, true); 
       lastsel = AssemblyID; 
      } 
     } 
    }).navGrid("#jqTablePager", 
     { refresh: false, add: false, edit: false, del: false }, 
      {}, // settings for edit 
      {}, // settings for add 
      {}, // settings for delete 
      {sopt: ["cn"]} // Search options. Some options can be set on column level 
    ); 

Answer 1

मुझे लगता है कि आप पहले से ही programID और buildID फ़ंक्शंस के रूप में परिभाषित गुणों का उपयोग करते हैं। ग्रिड के लिए डेटा प्राप्त करने के लिए प्रत्येक अनुरोध के दौरान कार्यों को बुलाया जाएगा। उसी तरह आप या editRow पैरामीटर का उपयोग कर सकते हैं जिसे आप स्पष्ट रूप से अपने onSelectRow कॉलबैक के अंदर कॉल करते हैं।

कोशिश the demo जो निम्नलिखित jqGrid विकल्प हैं कॉल करने के लिए:

inlineData: { 
    myParam: function() { 
     alert("inlineData is calling!!!"); 
     return "OK"; 
    } 
}, 
onSelectRow: function (id) { 
    if (id && id !== lastSel) { 
     $(this).jqGrid('restoreRow', lastSel); 
     $(this).jqGrid('editRow', id, true, null, null, null, { 
      myNextParam: function() { 
       alert("extraparam of 'editRow' is calling!!!"); 
       return "Fine"; 
      } 
     }); 
     lastSel = id; 
    } 
} 

आप दो अलर्ट दिखाई देंगे, अगर आप संपादन पंक्ति के डेटा की बचत होगी। मेरे डेमो में मैंने editurl: 'myDummyUrl' का उपयोग किया जिसमें सर्वर की ओर कोई कोड नहीं है और आपको अंत में एक त्रुटि दिखाई देगी, लेकिन यदि आप HTTP ट्रैफ़िक की जांच करते हैं (Fiddler या Firebug के संबंध में) आप देखेंगे कि निम्नलिखित अतिरिक्त पैरामीटर भेजे जाएंगे editurl:

myParam=OK&myNextParam=Fine 

मुझे लगता है कि आपको यही चाहिए।

inlineData:{} 

संपादन करते समय नियंत्रक के पास जाने से पहले काम करने के लिए ठीक काम कर रहा है। लेकिन हटाए जाने पर क्लिक करने के बाद, जेसन बनाने के लिए नियंत्रक को नियंत्रण पास करने से पहले ईवेंट को कैसे प्राप्त करें, इसे हटाने के मामले में।

Answer 2

आप अनुकूलित कर सकते हैं क्या onclickSubmit विकल्प का उपयोग कर सर्वर के लिए भेजा जा रहा है:

.navGrid("#jqTablePager", 
    { refresh: false, add: false, edit: false, del: false }, 
     { // settings for edit 
      onclickSubmit: function(params, postdata) 
      { 
       postdata.extraParam = 'value' 
      } 
     }, 
     {}, // settings for add 
     {}, // settings for delete 
     {sopt: ["cn"]} // Search options. Some options can be set on column level 
); 

नियंत्रक सभी संपादित गुण + extraParam युक्त एक JSON ऑब्जेक्ट प्राप्त होगा । यह आप पर निर्भर करता है कि आप इसे सर्वर के किनारे कैसे संभालेंगे।