This is a migrated thread and some comments may be shown as answers.

setting NumericTextBox value in client template

3 Answers 619 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Devon
Top achievements
Rank 1
Devon asked on 29 Aug 2012, 08:28 PM

How do you set the value of a numerictextbox client template. I've tried the following:
.Value("\\#=pollorder#")
.Value("\#=pollorder#")
.Value("#=pollorder#")
.Value(Convert.ToInt32("\#=pollorder#"))
All produce errors.

.Columns(columns => {
columns.Bound(s => s.ID).Visible(false);
columns.Bound(s => s.Order)
.ClientTemplate((Html.Kendo().NumericTextBox<int>()
.Name("order_#=ID#")
.Value("#=order#")
.Format("{0:n0}")
.Min(0)
.Max(100)
.Step(1)
.Decimals(0)
.Events(ev => ev.Change("numericBoxChanged"))
.ToClientTemplate()).ToHtmlString());

3 Answers, 1 is accepted

Sort by
0
Petur Subev
Telerik team
answered on 30 Aug 2012, 01:24 PM
Hello Devon,

Currently the NumericTextBox Value method only accepts int which means that the compiler will not allow you to put the client expression in it (because it is string).
To set the value you could use the following approach:
columns.Bound(o => o.OrderID).ClientTemplate(Html.Kendo().NumericTextBox<int>()
                    .Name("order_#=OrderID#")
            //.Value("#=order#")
                    .HtmlAttributes(new { value = "#=OrderID #" })
                    .Format("{0:n0}")
                    .Min(0)
                    .Max(100000)
                    .Step(1)
                    .Decimals(0)
                    .Events(ev => ev.Change("numericBoxChanged"))
                    .ToClientTemplate().ToHtmlString());


Kind regards,
Petur Subev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Evan
Top achievements
Rank 1
answered on 16 May 2013, 03:01 PM
I tried this exact example and it did not make the control a Numeric. It leaves it a textbox because the ready function that renders it as a Numeric does not fire on the grid databind.

If you want to see this behavior, just get the most recent Kendo MVC example project, go to razor/Views/Web/grid/ajaxbinding.cshtml and replace the OrderID column with your example.

Thanks
0
Petur Subev
Telerik team
answered on 21 May 2013, 11:26 AM
Hello Devon,

Basically you have to fix two potential issues:
  1. Remove or declare the Change event of the NumericTextBox
  2. Execute the initialization script manually when the dataBound event of the Grid occurs

For example the following demo for remote binding is working as expected in my project:

@model IEnumerable<Kendo.Mvc.Examples.Models.ProductViewModel>
 
@(Html.Kendo().Grid(Model)   
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(o => o.ProductID).Visible(true).ClientTemplate(Html.Kendo().NumericTextBox<int>()
                    .Name("order_#=ProductID#")
             
                    .HtmlAttributes(new { value = "#=ProductID #" })
                    .Format("{0:n0}")
                    .Min(0)
                    .Max(100000)
                    .Step(1)
                    .Decimals(0)
                    .ToClientTemplate().ToHtmlString());
        columns.Bound(p => p.ProductName);
        columns.Bound(p => p.UnitPrice);
        columns.Bound(p => p.UnitsInStock);
    })
    .Groupable()
    .Events(ev=>ev.DataBound("db"))
    .Pageable()
    .Sortable()
    .Scrollable()
    .Filterable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .Read(read => read.Action("Products_Read", "Grid"))
    )
)
 
<script type="text/javascript">
    function db() {
        this.tbody.find('script').each(function () {
            eval($(this).text());
        })
    }
</script>


Kind Regards,
Petur Subev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
Devon
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Evan
Top achievements
Rank 1
Share this question
or