चेकबॉक्स नियंत्रण

Question

के साथ केंडो यूआई एमवीसी ग्रिड कैसे सेट करें मैं केंडो यूआई एमवीसी ग्रिड का उपयोग कर रहा हूं। मॉडल के गुणों में से एक बूल है, इसलिए मुझे इसे ग्रिड में चेकबॉक्स के रूप में प्रस्तुत करने की आवश्यकता है। डिफ़ॉल्ट रूप से केंडो यूआई इसे कॉलम में "सत्य" और "गलत" मान के रूप में प्रस्तुत करता है। इसलिए आपको चेकबॉक्स प्राप्त करने के लिए क्लिक करने के लिए पहली बार आवश्यकता है, फिर दूसरी बार combobox के मान को बदलने के लिए क्लिक करें। ग्रिड से डिफ़ॉल्ट मान रखने के बजाय, मैंने क्लाइंट टेम्पलेट सेट किया है, इसलिए मुझे "सत्य" और "झूठे" मानों के बजाय चेकबॉक्स मिला।

   c.Bound(p => p.GiveUp) 
        .Title("Giveup") 
        .ClientTemplate("<input type='checkbox' id='GiveUp' name='GiveUp' #if(GiveUp){#checked#}# value='#=GiveUp#' />") 
        .Width(50); 

इस ग्रिड बैच संपादन का उपयोग करता है और में ग्रिड संपादन (GridEditMode.InCell)

 .Editable(x => x.Mode(GridEditMode.InCell)) 
     .DataSource(ds => ds.Ajax() 
          .ServerOperation(false) 
          .Events(events => events.Error("error")) 
          .Batch(true) 
          .Model(model => model.Id(p => p.Id)) 
          .Read(read => read.Action("Orders", "Order").Data("formattedParameters")))) 

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

कृपया सलाह दें कि मैं क्या गलत कर रहा हूं।

अग्रिम धन्यवाद।

Answer 1

असल में जब आप ग्रिड से रिकॉर्ड्स जोड़ते/निकालते हैं तो लाल त्रिकोण हमेशा गायब हो जाते हैं (या जब आप सॉर्ट/पेज/फ़िल्टर इत्यादि), चेकबॉक्स लाल त्रिकोण के साथ समस्या नहीं है।

अब यदि आप क्लाइंट टेम्पलेट बनाते हैं तो चेकबॉक्स के लिए जो एक चेकबॉक्स है, आपको सेल को संपादन मोड में रखने के लिए एक बार क्लिक करना होगा (आपको कोई फर्क नहीं पड़ता क्योंकि संपादक टेम्पलेट फिर से एक चेकबॉक्स है) ताकि आप वास्तव में मूल्य बदलने के लिए दूसरी बार क्लिक करने की आवश्यकता है।

मैं आपको सबसे अच्छा अभ्यास के रूप में सुझाव देता हूं कि here से जुड़े दृष्टिकोण का उपयोग करना है - यह रास्ता अधिक तेज़ है (ग्रिड के लिए कम ऑपरेशन) और ऊपर दिए गए दृष्टिकोण के साथ दो क्लिक को संभालने के लिए अतिरिक्त तर्क लागू करने से यह आसान है।

Answer 2

उन लोगों के लिए जो देखना चाहते हैं कि पूर्ण कोड कैसा दिखता है।

Home.cshtml

@(Html.Kendo().Grid<OrdersViewModel>() 
      .Name("Orders") 
      .Columns(c => 
      { 
       c.Bound(p => p.Error) 
        .Title("Error") 
        .ClientTemplate("<input type='checkbox' #= Error ? checked='checked': '' # class='chkbx' />") 
        .HtmlAttributes(new {style = "text-align: center"}) 
        .Width(50); 


<script> 
    $(function() { 
     $('#Orders').on('click', '.chkbx', function() { 
      var checked = $(this).is(':checked'); 
      var grid = $('#Orders').data().kendoGrid; 
      var dataItem = grid.dataItem($(this).closest('tr')); 
      dataItem.set('Error', checked); 
     }); 
    }); 
</script>