Set width on client-side

[Scott]

How do you set the width on the client-side via javascript for the NumericTextBox....?

[Dimo]

Hi Scott,

You can set a width style to the NumbericTextBox wrapper element. By default, it has a 12.4em width style applied in kendo.common.css.

Regards,
Dimo
the Telerik team

[Scott]

$("#MyTextBox").width(50);

The above line works perfectly for setting the width on a NumericTextBox on the page... however I have a NumericTextBox in a Window that loads after clicking a link.... and when I try and set the width of it, it does nothing... I even tried setTimeout thinking perhaps it just didn't exist in DOM yet... but that did nothing also....

in popup window.... neither of these worked....

$("#PopupTextBox").width(50);

setTimeout(function () { $("#PopupTextBox").width(50); }, 250);


What could be stopping the width from being set....

[Dimo]

Hi Scott,

As mentioned, you need to set the width style to the wrapper, not the textbox itself.

If you need further assistance, please submit a support ticket.

Regards,
Dimo
the Telerik team

[Scott]

That doesn't make any sense considering the line below works perfectly fine....

$("#MyTextBox").width(50);

It just doesn't work in a Kendo UI Window.....

As for the "wrapper" element, the page you referenced here, makes NO mention of wrapper or clientObject.... I'm assuming you mean the line below:

$("#MyTextBox").data("kendoNumericTextBox");

If so... how do I access the wrapper or clientObject from this.... because the lines below return undefined....

$("#MyTextBox").data("kendoNumericTextBox").wrapper;
$("#MyTextBox").data("kendoNumericTextBox").clientObject;

[Dimo]

The NumericTextBox client object is accessed with

$("#id").data("kendoNumericTextBox")

This is explained at the bottom of the provided help topic.

I can't imagine a reason why the following would work...

$("#MyTextBox").width(50);

...unless you are not using the Kendo UI MVC wrappers, but the MVC components.

Regards,
Dimo
the Telerik team

[Dimo]

P.S. Are you by any chance using the legacy themes for the Kendo UI wrappers for MVC?

[Scott]

Originally this project was used with the Telerik Extensions for MVC... but in process of converting over to KendoUI for MVC.... we are NOT using the LegacyThemes but instead are fully embracing KendoUI's version of the MVC controls... we have removed ALL references to Telerik.Web.Mvc and replaced it with KendoUI namespaces and such... including the new themes... we are using BlueOpal.

[Dimo]

Hi Scott,

In order to prevent further message roundtrips and facilitate faster resolution, please provide a runnable demo of you current implementation and I will inspect it locally.

All the best,
Dimo
the Telerik team

[Scott]

I was able to set the width of the numeric text box in the popup, however am still unable to hide it without using a setTimeout.... also this example shows where I can use $("#id).width(50) to set the width and it wasn't suppose to work that way, but did... fyi...

Sample can be found here...

[Dimo]

Hi Scott,

>> this example shows where I can use $("#id).width(50) to set the width and it wasn't suppose to work that way

The $("#id).width(50) script works, because you are setting the width to the textbox element before the widget's initialization. The widget picks up the custom width and applies it to the wrapper element. This is a viable approach if you want to use it that way. However, if you will be setting a width after widget initialization, you should set it to the wrapper.

$("#TempTextBox").wrapper.width(50);

Greetings,
Dimo
the Telerik team

[Scott]

Is there a way to check and see if the widget is initialized or not... because document.ready isn't it.....

$(#id").data("kendoNumericTextBox") = undefined

Is this what I would check to see if it is initialized or not? When it returns a value, it has been initialized? Or is there a better way?

[Dimo]

Hi Scott,

Yes, this is the way to check for an initialized widget.

Regards,
Dimo
the Telerik team