Binding floating-label textbox to view model doesn't appear work.

Assume that the view model contains an object name UserInformation and that object contains a string named NewEmail.
Given the following code:
  <ejs-textbox id="UserInformation_NewEmail" name="UserInformation_NewEmail"
                                 ejs-for="@Model.UserInformation.NewEmail" 
                                 placeholder="Email" floatLabelType="Auto"></ejs-textbox>

The current value populated in the model does not bind or show on the page.

using the value property instead of ejs-for also results in no data being bound to the control.
 <ejs-textbox id="UserInformation_NewEmail" name="UserInformation_NewEmail"
                     value="@Model.UserInformation.NewEmail" placeholder="Email" floatLabelType="Auto"></ejs-textbox>


Chaning from the tag helper to an input tag works as expected:
                    <input class="e-input" id="UserInformation_NewEmail" name="UserInformation_NewEmail" 
                        value="@Model.UserInformation.NewEmail" placeholder="Email">

but that's expected seeing it's a html tag w/ css, and not a full tag helper. This would also require me to manually add the floating label to each input box I wanted to use it with.


Am I using the control/tag helper incorrectly? Is there a different configuration of properties that will let the value be bound?
I am using version Syncfusion.EJ2.AspNet.Core Nuget package v16.3.0.21

Thanks,
John


5 Replies

PO Prince Oliver Syncfusion Team October 18, 2018 08:48 AM UTC

Hi John, 

Thank you for contacting Syncfusion support. 

We can replicate the issue in our end and we have confirmed this as bug. The fix for this issue will be included in the upcoming patch release. 

Regards, 
Prince 



JA John Anderson October 18, 2018 12:41 PM UTC

Thank you for your timely reply and confirmation that it is a bug.


CI Christopher Issac Sunder K Syncfusion Team October 19, 2018 04:32 AM UTC

Hi John, 
  
Most welcome, let us know if you need further assistance. 
  
Thanks,
Christo 



JA Jacques January 10, 2019 07:20 PM UTC

Hi

Yesterday I installed Syncfusion.EJ2.AspNet.Core v. 16.4.0.46 and it looks like I can replicate the issue still.

Using the ejs-textbox helper did not post back the value of the textbox which resulted in validation preventing me from submitting the form as this is a required field.

<ejs-textbox ejs-for="Product.Name" floatLabelType="Auto" placeholder="Product Name" name="Product_Name" id="Product_Name"></ejs-textbox>

Changing from a tag helper to an input tag did not help either.

<input class="e-input" id="Product_Name" name="Product_Name" value="@Model.Product.Name" type="text" />

While using the input tag I changed the underscore in the name attribute to a full stop.  Now the value is posted back.

<input class="e-input" id="Product_Name" name="Product.Name" value="@Model.Product.Name" type="text" />

So using the tag helper I specify the name attribute using a full stop and the id attribute using an underscore and it works.

<ejs-textbox ejs-for="Product.Name" floatLabelType="Auto" placeholder="Product Name" name="Product.Name" id="Product_Name"></ejs-textbox>

It would appear the tag helper does not generate the id and name attributes correctly







PO Prince Oliver Syncfusion Team January 16, 2019 04:24 PM UTC

Hi Jacques, 

Thank you for contacting Syncfusion support. 

We have resolved this issue ASP.NET MVC platform and the fix is available now. But the same issue persists in ASP.NET Core platform. We have confirmed this as bug in ASP.NET Core platform and we will include the fix in upcoming Volume 1, 2019 release which is schedule to available in the month of March. Until then we suggest you to manually set the name attribute in the tag helper to post the value. 

Please let us know if you need any further assistance on this. 

Regards, 
Prince 


Loader.
Up arrow icon