Make HTML TextBox render with same appearance as Syncfusion Essential JavaScript controls

[Seth]

Is there a Syncfusion TextBox control for the LightSwitch HTML client?

If not, is there a way to modify HTML TextBox controls in a LightSwitch HTML client to render with the same appearance as the other Syncfusion EJ controls?  I have seen this article which gives details on how to change a HTML TextBox to a JS TextBox but I cannot see how to do this for a LightSwitch HTML app.

[Balamurugan P]

Hi Seth, 

Thanks for using Syncfusion products 

We have analyzed your requirement. Since we don’t have individual textbox control, we have modified the HTML textbox control with the same appearance as of other Syncfusion EJ controls as per specified in the attached document,. Please refer following steps to bring EJ UI for HTML textbox, which is available in LightSwitch application. 

 

1)     Please choose custom control option in LightSwitch application  

2)     In render event section, add below specified code block. Here “data-role” property helps to prevent the adding LightSwich application based CSS styles. 

 

 myapp.BrowseTable1Items.CustomerName_render = function (element, contentItem) { 

    // Write code here.     

    var $normalTextbox = $('<input value=' + contentItem.__value + ' />'); 

    $normalTextbox.attr("data-role", "none"); 

    $normalTextbox.attr("class", "e-textbox"); 

    $(element).append($normalTextbox); 

}; 

 

We have prepared a sample based on this and you can check it from following location 

Sample: http://www.syncfusion.com/downloads/support/forum/125696/ze/Textbox-1736842359  

Please let us know if you require any further assistance. 

 

Regards, 

Balamurugan P 

[Seth]

Thanks Balamurugan.  That works great!

[Karthik Ravichandran]

Hi Seth, 

 

Thanks for the update. 

 

 Please get back to us if you require further assistance on this 

 

Regards
Karthik R