field name is not shown in e-outline mode when the date field is filled.

[Roberto]

Hi,

I would like the field name to be shown as it is done in ejs-numerictextbox.

This same problem happens in the dropdownlist, combobox components.

see photo

How to do this?

Thank you for your help.

  <ejs-datetimepicker locale="pt"

                                id="datamovimenta"

                                name="datamovimenta"

                                ejs-for="datamovimenta"

                                value="@Model.datamovimenta"

                                max="@DateTime.Now"

                                cssClass="e-multi-column e-outline"

                                placeholder="Data movimentação">

                </ejs-datetimepicker>

[Sureshkumar P]

Hi Roberto,

We suggest you use the floatLabelType property to achieve your requirement from your application on datetimepicker,dropdownlist, combobox components.

Find the code example here:

<ejs-datetimepicker locale="pt"

                    id="datamovimenta"

                    name="datamovimenta"

                    ejs-for="datamovimenta"

                    value="@Model.datamovimenta"

                    max="@DateTime.Now"

                    cssClass="e-multi-column e-outline"

                    floatLabelType="Auto"

                    placeholder="Data movimentação">

 

</ejs-datetimepicker>

Regards,

Sureshkumar P

[Roberto]

Hi,

It is woking.

but how to put the field name different from the placeholder?

placeHolder = "Select an item" but I would like to show when the field is filled only "Item"

thanks

[Sureshkumar P]

Hi Roberto,

We suggest you change the placeholder text by using the placeholder property value as like the below code example

Find the code example here:

<ejs-dropdownlist id="vegetable" dataSource="@ViewBag.data" cssClass="e-multi-column e-outline" placeholder="Item" floatLabelType="Auto" popupHeight="220px">

    <e-dropdownlist-fields value="Vegetable"></e-dropdownlist-fields>

</ejs-dropdownlist>

Regards,

Sureshkumar P

[Roberto]

Hello,

I understand, but when the field is blank I would like to show other text that is not the same when the field is filled.

[Sureshkumar P]

You can change the placeholder property value dynamically based on component value by using the component instance.

Find the code example here:

<ejs-dropdownlist id="vegetable" dataSource="@ViewBag.data" change="Valuechange" cssClass="e-multi-column e-outline" placeholder="select any Item" floatLabelType="Auto" popupHeight="220px">

 

    <e-dropdownlist-fields value="Vegetable"></e-dropdownlist-fields>

 

</ejs-dropdownlist>

 

<script type="text/javascript">

    function Valuechange() {

        // get the component instance

        var Instance = document.getElementById('vegetable').ej2_instances[0];

        if(Instance.value !=null){

            // check the component value is null or not

            Instance.placeholder = "select any Item";

        } else {

            // change the placeholder text after changed the value

            Instance.placeholder = "already Item selected";

        }

    }

</script>

[Roberto]

Hi,

Perfect!!

thanks.