Disable JQGrid row based on cell value using JQuery

Question

I am trying to disable a row in my JQGrid. And By using HtmlHelper class the JQGrid is done for dynamic load. An example is given below as shown that

  public static MvcHtmlString CreateSubGrid<T>(this HtmlHelper helper,      
                                                    GridViewModel<T> model)
 {

     htmlBuilder.AppendFormat(@"<table id=""{0}"" class=""scroll""    
       cellpadding=""0"" cellspacing=""0""></table>", model.Id);
     htmlBuilder.AppendFormat(@"<div id=""{0}Pager"" class=""scroll"" 
                         style=""text-align:center;""></div>", model.Id);

     htmlBuilder.AppendFormat(@"<script type=""text/javascript"">");
    .....
    .....

And My view model contains seven columns, In which the 7th column name is "IsClosed". If this column contains Yes, or any value, then the entire row should be non-editable. And I don not know how doing it. So anybody help me please.

My View Model is following,

public class OBRAccountViewModel 
{
    [JQGridColumn(IsHidden = true)]
    public virtual long OBRBankSeq { get; set; }

    [JQGridColumn(IsHidden = true)]
    public virtual long OBRSeq { get; set; }

    [JQGridColumn(Name = "Overseas Account No", Index = "{0}", Width = 145, IsSearch = true)]
    public virtual string OverSeasAccountNo { get; set; }

    [JQGridColumn(Name = Constants.DisplayName.BeneficiaryBank, Index = "{0}", Width = 130, IsSearch = true)]
    public virtual string BeneficiaryBank { get; set; }

    [JQGridColumn(Name = Constants.DisplayName.CurrencyCode, Index = "{0}", Width = 130, IsSearch = true)]
    public virtual string CurrencyCode { get; set; }     

    [JQGridColumn(Name = Constants.DisplayName.AccountClosureDate, Index = "{0}", Width = 130, IsSearch = true,IsEditable=true)]
    public virtual DateTime? ClosureDate { get; set; }

    [JQGridColumn(Name = Constants.DisplayName.AccountClosureRemarks, Index = "{0}", Width = 250, IsSearch = true, IsEditable = true)]
    public virtual string ClosureRemarks { get; set; }

    [JQGridColumn(Name = "IsClosed", Index = "{0}", Width = 250, IsSearch = true, IsEditable = true,IsHidden=false)]
    public virtual string IsClosed { get; set; }    

}

score 1 · Answer 1 · edited May 23 '17 at 10:28

1

I'd recommend you to use rowattr to add classes "ui-state-disabled ui-jqgrid-disablePointerEvents" if IsClosed contains "Yes". See the old answer where I described the approach. Don't forget to use gridview: true option to have additional performance advantage. Look at the

gridview: true,
rowattr: function (rd) {
    if (rd.IsClosed === "Yes") { // verify that the testing is correct in your case
        return {"class": "ui-state-disabled ui-jqgrid-disablePointerEvents"};
    }
}

If you use the latest version of free jqGrid then ui.jqgrid.css contains the CSS rule

.ui-jqgrid-disablePointerEvents {
    pointer-events: none;
}

If you uses other fork on an older version of jqGrid then you should add the above role manually.

By the way you can remove from your code the part with class=""scroll"" cellpadding=""0"" cellspacing=""0"" and class=""scroll"" style=""text-align:center;"". The setting are deprecated since many years. jqGrid don't use the class scroll internally and just remove it if it is exist.

edited May 23 '17 at 10:28

Community

1
1

answered Jun 08 '15 at 09:21

Oleg

220,925
34
403
798

Actually, I want it in Jquery. How to do it in JQuery? Or else can you give the full sample code, then I can easily find the solution – Md Aslam Jun 08 '15 at 13:21
The javascript is written in C#, So i can not get the IsClosed column's value @Oleg – Md Aslam Jun 08 '15 at 13:25
@MdAslam: [The old answer](http://stackoverflow.com/a/10531680/315935) which I reference in my answer contains [the demo](http://www.ok-soft-gmbh.com/jqGrid/SimpleLocalGridChangeRowBackgroundBasedOnCheckboxes3.htm) which demonstrates `rowattr`. Your question about jqGrid which is written in JavaScript (as plugin to jQuery) in 100%. So the usage of some server side language can follow misunderstandness only. The most possibility to include some logic in the grid you have in JavaScript only. – Oleg Jun 08 '15 at 14:23

Disable JQGrid row based on cell value using JQuery

1 Answers1