Grid Checkbox

Question

When i select on grid checkbox to true , i want to flip the readonly tofalse for the dropdown When checkbox not selected, the readonly shd be true for dropdownisSelected is true/falsereadonly="!data.isSelected"

Ajith Govarthan · Accepted Answer

Hi vin, 
 
Thanks for contacting Syncfusion support. 
 
Query: When i select on grid checkbox to true , i want to flip the readonly tofalse for the dropdown When checkbox not selected, the readonly shd be true for dropdown isSelected is true/false 
 
Based on the attached code example and the query you want to make the dropdown component to be read-only when you uncheck the checkbox and similarly when you check the checkbox you want to disable the read-only property. 
 
Based on that we have prepared sample in that we have used the change event of the check box component and using the change event we have changed the read-only property based on the checkbox state. For your convenience we have attached the sample. So please refer them for your reference. 
 
Code Example: 




App.component.ts 
 
  chboxChange(args) { 
    let currentTr = parentsUntil(args.event.target, "e-row"); 
    let dropObj = currentTr.querySelector(".e-control.e-dropdownlist")[ 
      "ej2_instances" 
    ][0]; 
    dropObj.readonly = !args.checked; 
  } 
 
Sample Link: https://stackblitz.com/edit/angular-9javhc-3dgl3q?file=app.component.ts 
 
Please get back to us if you need further assistance. 
 
Regards, 
Ajith G.

vin · Answer

When i select on grid checkbox to true , i want to flip the readonly tofalse for the dropdown When checkbox not selected, the readonly shd be true for dropdownisSelected is true/falsereadonly="!data.isSelected"

Any help pls!!

vin · Answer

Thanks I need to ensure, the dropdown is selected ONLY when the checkbox is selected

Please Select

Ajith Govarthan · Answer

Hi vin, 
 
Thanks for the update. 
 
Query: I need to ensure, the dropdown is selected ONLY when the checkbox is selected 
 
In our previous update we have provided sample and in that sample we have showed the popup list in the dropdown only when the checkbox is in the checked state using the read-only property of the dropdown component. 
 
So, please confirm that you want to prevent the focus also in the dropdown component when the checkbox is unchecked or please explain more details on your query with screenshots to validate further on your requirement. 
 
Regards, 
Ajith G.

vin · Answer

I need to do a required validation for dropdown when the checkbox is checked

vin · Answer

I need to do a required validation for dropdown when the checkbox is checked Any suggestions

Manivel Sellamuthu · Answer

Hi vin, 

Thanks for your update. 

In Grid by default validation will be performed while editing only. Since we have rendered the dropdown and checkbox in the column template it is not feasible to perform validation for dropdown. 

Please let us know, if you need further assistance. 

Regards, 
Manivel

Nagendra Gupta · Answer

Hey Team,Given Example Work Fine at Row Level but I need to checked all row checkbox after click on header leve

Joseph Christ Nithin Issack · Answer

Before proceeding to the solution, please ensure your
requirement is to add a check box and dropdown to the header and when you click
on the header checkbox you want to change the read-only mode of the dropdown in
the header? Or is your requirement is to change the read-only mode of all the
dropdowns in the grids content when you check or uncheck the checkbox in the
header?Please get back to us with the details requested so that we
may be able to proceed further.