AEM - Number Field Component using Sling Model

NumberfieldSampleComponentModel.java

//C:\aem-project\aemgeeks\core\src\main\java\com\aemgeeks\core\models\NumberfieldSampleComponentModel.java
package com.aemgeeks.core.models;

import org.apache.sling.api.resource.Resource;
import org.apache.sling.models.annotations.DefaultInjectionStrategy;
import org.apache.sling.models.annotations.Model;

import javax.inject.Inject;

@Model(adaptables = Resource.class, defaultInjectionStrategy = DefaultInjectionStrategy.OPTIONAL)
public class NumberfieldSampleComponentModel {
    @Inject
    private Long yourphone;
    @Inject
    private Integer yourpin;

    public Long getYourphone() {
        return yourphone;
    }

    public Integer getYourpin() {
        return yourpin;
    }
}

numberfieldsamplecomponentwithdialogcrxd.html

//C:\aem-project\aemgeeks\ui.apps\src\main\content\jcr_root\apps\aemgeeks\components\AEMComponent\numberfieldsamplecomponentwithdialogcrxd\C:\aem-project\aemgeeks\ui.apps\src\main\content\jcr_root\apps\aemgeeks\components\AEMComponent\numberfieldsamplecomponentwithdialogcrxd\numberfieldsamplecomponentwithdialogcrxd.html
<sly data-sly-use.userInfo="com.aemgeeks.core.models.NumberfieldSampleComponentModel">
<h2>${userInfo.yourphone}</h2>
<p>${userInfo.yourpin}</p>
</sly>
<sly data-sly-use.templates="core/wcm/components/commons/v1/templates.html" />
<sly data-sly-call="${templates.placeholder @ isEmpty = !userInfo.yourphone}" />

numberfieldsamplecomponentwithdialogcrxd\.content.xml

C:\aem-project\aemgeeks\ui.apps\src\main\content\jcr_root\apps\aemgeeks\components\AEMComponent\numberfieldsamplecomponentwithdialogcrxd\.content.xml
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:Component"
    jcr:title="Numberfield Sample Component with Dialog CRXD"
    componentGroup="AEM Geeks - Content"/>

numberfieldsamplecomponentwithdialogcrxd\_cq_dialog\.content.xml

//C:\aem-project\aemgeeks\ui.apps\src\main\content\jcr_root\apps\aemgeeks\components\AEMComponent\numberfieldsamplecomponentwithdialogcrxd\_cq_dialog\.content.xml
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0"
    jcr:primaryType="nt:unstructured"
    jcr:title="User Details"
    sling:resourceType="cq/gui/components/authoring/dialog">
    <content
        jcr:primaryType="nt:unstructured"
        sling:resourceType="granite/ui/components/coral/foundation/fixedcolumns">
        <items jcr:primaryType="nt:unstructured">
            <column
                jcr:primaryType="nt:unstructured"
                sling:resourceType="granite/ui/components/coral/foundation/container">
                <items jcr:primaryType="nt:unstructured">
                    <yourphone
                        jcr:primaryType="nt:unstructured"
                        sling:resourceType="granite/ui/components/coral/foundation/form/numberfield"
                        fieldLabel="Your Phone No"
                        name="./yourphone"/>
                    <yourpin
                        jcr:primaryType="nt:unstructured"
                        sling:resourceType="granite/ui/components/coral/foundation/form/numberfield"
                        fieldLabel="Your Pin No"
                        name="./yourpin"/>
                </items>
            </column>
        </items>
    </content>
</jcr:root>