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. Image for the cookie policy date

How to show the numeric keypad in mobile device when edit the number column in Angular Grid

Hi

What should be done to show the numeric key pad when editing a   ej2 grid column with edit type set as  numeric edit.

Thank You

1 Reply

PS Pavithra Subramaniyam Syncfusion Team September 5, 2019 04:12 AM

Hi Sahal, 
 
Greetings from the Syncfusion support, 
 
To achieve your requirement, we suggest you to define the Numeric TextBox “htmlAttributes .type” in column.editParams property to get the numeric edit pad in mobile device while edit numeric column. Please refer the below code example and sample for more information. 
 
[app.component.html] 
<ejs-grid #normalgrid id='Normalgrid' [dataSource]='data' allowPaging='true' [pageSettings]='pageSettings' [editSettings]='editSettings' [toolbar]='toolbar' (actionBegin)='actionBegin($event)' (queryCellInfo)="queryCellInfo($event)"> 
            <e-columns> 
                .    .     .    . 
                <e-column field='Freight' headerText='Freight' width='140' format='C2' textAlign='Right' editType="numericedit" [edit]="freightParams" [validationRules]='freightrules'></e-column> 
               .     .      .      . 
            </e-columns> 
        </ejs-grid> 
 
[app.component.ts] 
this.freightParams = { params: {             
            htmlAttributes:{type:"number"} } 
        }; 
 
 
 
 
Please get back to us, if you need further assistance. 
 
Regards, 
Pavithra S. 


Loader.
Live Chat Icon For mobile
Up arrow icon