We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

Enable/Disable row selection depending on condition

Thread ID:

Created:

Updated:

Platform:

Replies:

121854 Feb 1,2016 08:53 AM Feb 2,2016 03:53 AM ASP.NET MVC 2
loading
Tags: Grid
Gajanan Deshpande
Asked On February 1, 2016 08:53 AM

Hi,

    I have One question related enable disable row selection depending on the column field data in asp.net mvc Grid.

I have Grid as follows:



  @(Html.EJ().Grid<object>("HPCJobGrid")
        .Datasource((List<ARAPL.BusinessObjects.HPCOperation>)ViewBag.HpcJobGrid)
        .CssClass("SyncGridStyle")
              .AllowFiltering()
              .EnableHeaderHover()
              .FilterSettings(filter => { filter.FilterType(FilterType.Excel); })
        .AllowPaging()
        .AllowResizing()
        .Columns(col =>
        {
            //col.HeaderTemplateID("#headerTemplate").Template(true).TemplateID("#checkboxTemplate").Width(50).Add();//The checkbox column is bound to the grid using template property and headerTemplateID property
            col.Field("JobId").HeaderText("Job ID").TextAlign(TextAlign.Right).Width(40).Add();
            col.Field("UserId").HeaderText("User ID").Width(150).Add();
            col.Field("AnalysisType").HeaderText("Analysis Type").Width(60).Add();
            col.Field("JobStatus").HeaderText("Job Status").Width(60).Add();
            col.Field("LogFileName").HeaderText("Log File Name").Width(80).Add();
            col.Field("SubmissionDateTime").HeaderText("Submission Date Time").TextAlign(TextAlign.Right).Format("{0:yyyy-MM-dd hh:mm:ss.fff}").Width(120).Add();
            col.Field("LastUpdationDateTime").HeaderText("Last updation Date Time").TextAlign(TextAlign.Right).Format("{0:yyyy-MM-dd hh:mm:ss.fff}").Width(120).Add();
            col.Field("JobDetails").HeaderText("Job Details").Width(180).Add();
        })
     )


Condition:

column field "JobStatus" have value as - Finished, Failed, Queued etc

I want enable selection to the only row which have "Finished" value. other rows should not be enable for select.
I am trying to handle event using jquery but could not manage at all.
so please help me to handle client side event for above using jquery.

Balaji Marimuthu [Syncfusion]
Replied On February 2, 2016 03:51 AM

Hi Gajanan,

Thanks for contacting Syncfusion support.

You can enable/disable the row selection based on columns data in Grid using the client side RowSelection event. Refer to the sample, Help Document, code example given below.


Sample: RowSelection

Help Document: http://help.syncfusion.com/js/api/ejgrid#events:rowselecting



@(Html.EJ().Grid<object>("FlatGrid")

        .Datasource((IEnumerable<object>)ViewBag.datasource)

        .AllowFiltering()

        .EnableHeaderHover()

        .FilterSettings(filter => { filter.FilterType(FilterType.Excel); })

        .AllowPaging()

        .AllowResizing()

        .Columns(col =>

        {

            col.Field("JobID").HeaderText("Order ID").TextAlign(TextAlign.Right).Width(75).Add();

            col.Field("UserID").HeaderText("Customer ID").Width(80).Add();

            col.Field("JobStatus").HeaderText("Employee ID").TextAlign(TextAlign.Right).Width(75).Add();

            col.Field("JobCountry").HeaderText("Ship City").Width(110).Add();

        })

        .ClientSideEvents(eve => eve.RowSelecting("rowselecting"))

)


<script type="text/javascript">


    function rowselecting(args) {

        if (args.data["JobStatus"] != "Finished")

            args.cancel = true;         //prevent the rowselection

    }


</script>





In the above code example, we have enabled the rowselection for the value of JobStatus as Finished and prevented the row selection for both Failed and Queued by checking the condition using the args.data[“JobStaus”] in row selecting event.

Regards,
Balaji Marimuthu

Balaji Marimuthu [Syncfusion]
Replied On February 2, 2016 03:53 AM

Hi Gajanan,

Please ignore our previous update.

You can enable/disable the row selection based on columns data in Grid using the client side RowSelecting event. Refer to the sample, Help Document, code example given below.


Sample: RowSelection

Help Document: http://help.syncfusion.com/js/api/ejgrid#events:rowselecting



@(Html.EJ().Grid<object>("FlatGrid")

        .Datasource((IEnumerable<object>)ViewBag.datasource)

        .AllowFiltering()

        .EnableHeaderHover()

        .FilterSettings(filter => { filter.FilterType(FilterType.Excel); })

        .AllowPaging()

        .AllowResizing()

        .Columns(col =>

        {

            col.Field("JobID").HeaderText("Order ID").TextAlign(TextAlign.Right).Width(75).Add();

            col.Field("UserID").HeaderText("Customer ID").Width(80).Add();

            col.Field("JobStatus").HeaderText("Employee ID").TextAlign(TextAlign.Right).Width(75).Add();

            col.Field("JobCountry").HeaderText("Ship City").Width(110).Add();

        })

        .ClientSideEvents(eve => eve.RowSelecting("rowselecting"))

)


<script type="text/javascript">


    function rowselecting(args) {

        if (args.data["JobStatus"] != "Finished")

            args.cancel = true;         //prevent the rowselection

    }


</script>





In the above code example, we have enabled the rowselection for the value of JobStatus as Finished and prevented the row selection for both Failed and Queued by checking the condition using the args.data[“JobStaus”] in row selecting event.

Regards,
Balaji Marimuthu

CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;