Telerik Forums
UI for ASP.NET MVC Forum
1 answer
116 views
I have a grid with another grid inside the client detail.  Each grid gets it data using ajax calls.

 In the second grid I need to display various buttons against each row based on a value in a status field (let's call that StatusID)
The number of buttons varies from none to 5.  I was thinking to put them all inside 1 column.
How can I achieve this ? 

I am using the fluent grid declaration

After playing with it for a while I noticed this :

In my second grid ( aka the grid inside  the ClientDetailTemplateID, i cannot use the bound values whatever I do

My column looks like this :

columns.Bound(p => p.PublishStatusID).ClientTemplate("#= PublishStatusID #");
As you can see this is just a test to get the value to display before I move on to building a button. I am getting an error  telling me that PublishStatusID  does not exist. In fact none of the bound properties can be accessed at all except for the one which is basically the key passed by the parent grid.
The data in the grid itself displays fine, but I cannot access it whatever I do in a ClientTemplate

The controller is setup to return data for the grid : 
public JsonResult GetSomeData([DataSourceRequest] DataSourceRequest request, int someID)
 and it returns this.Json(model.ToDataSourceResult(request), JsonRequestBehavior.AllowGet);

What's going on ?





Petur Subev
Telerik team
 answered on 26 Aug 2013
11 answers
722 views
I'm trying to create an implementation of the imagebrowser where the images are read from a database table. 

It reads the images correctly from the database, but they are being treated as folders for some reason. So it never calls the Thumbnail controller method, it just displays the default folder thumbnail. The same thing happens when I try to select an image. It doesn't call the Image method, but instead another call to the Read method.

Any ideas?

I've attached some snippets from my code. We are currently usin gKendoUI 213.1.514.


Regards,
Jan Erik
Rosen
Telerik team
 answered on 26 Aug 2013
5 answers
131 views
Hello all,

I'm experiencing an issue with keyboard navigation and saving for grids with batch editing enabled.  I'm using the Kendo editor templates for Number and Currency in my grids where appropriate based on the model.  When using the tab key to navigate through and edit the cells, the values typed in to the numeric textbox columns never get saved.  I dug into this a little more and noticed that the grid's Save event is not being fired.  Is there something special I need to do to get this to work?  Or is it not supported to use the NumericTextBox control inside a grid cell?  Thanks for the help!

To reproduce this with the Kendo Demo project, just add the .Navigatable() property to the editing.cshtml file in the grid folder.

Regards,
Brian
Amol
Top achievements
Rank 1
 answered on 26 Aug 2013
1 answer
209 views
Hi,

I'm noticing a weird issue when I try to use "@using (Ajax.BeginForm(...)) { }" within Items' Contents. All of the form elements that end up inside of each PanelBar item are all being rendered outside of the PanelBar (placed right before the rendered PanelBar's ul element). For example, this code:

@(Html.Kendo().PanelBar()
    .Name("accordion")
    .Items(bar =>
        {
            bar.Add().Text("One")
                .Content(@<div>
                           @using (Ajax.BeginForm("OneSuccess", "Custom", new AjaxOptions {UpdateTargetId = "resultOne"}))
                            {
                                @Html.DemoPartial("Partial")
                                <div id="resultOne"></div>
                            }
                        </div>);
            bar.Add().Text("Two")
                .Content(@<div>
                           @using (Ajax.BeginForm("TwoSuccess", "Custom", new AjaxOptions {UpdateTargetId = "resultTwo"}))
                            {
                                @Html.DemoPartial("Partial")
                                <div id="resultOne"></div>
                            }
                        </div>);
            bar.Add().Text("Three")
                .Content(@<div>
                           @using (Ajax.BeginForm("OneSuccess", "Custom", new AjaxOptions {UpdateTargetId = "resultThree"}))
                            {
                                @Html.DemoPartial("Partial")
                                <div id="resultThree"></div>
                            }
                        </div>);
         }))
Results in:
<form ...></form>
<form ...></form>
<form ...></form>
<ul class="k-widget k-panelbar k-reset k-header" id="accordion" data-role="panelbar" tabindex="0" role="menu">
... No forms in here ...
</ul>

Is there something incorrect about how I'm setting up the PanelBar or is there a workaround I can use to get the functionality I need?

Thanks,
Zach







Petur Subev
Telerik team
 answered on 26 Aug 2013
0 answers
219 views
Found my answer here

I have declared the following in my Login.cshtml file.  Everything displays and accepts user input correctly.  However, the form submit button does nothing.  Is there a way to get it to work?

@model LoginModel

@{
    ViewBag.Title = "Login";
}

@(Html.Kendo().MobileView()
    .Name("view-login")
    .Title("Login")
    .Header(obj =>
        (Html.Kendo().MobileNavBar()
                .Name("nav")
                .Content(navbar =>
                    @<text>
                    @navbar.ViewTitle("")
                    </text>
                )
            )
        )
    .Content(
        @<text>
        @LoginForm()
        </text>
    )
    )
)

@helper LoginForm()
    {
    <section id="loginForm">
    @using (Html.BeginForm())
    {
        @Html.AntiForgeryToken()
        @Html.ValidationSummary(true)

        <fieldset>
            <legend>Log in Form</legend>
            <ol>
                <li>
                    @Html.LabelFor(m => m.UserName)
                    @Html.TextBoxFor(m => m.UserName)
                    @Html.ValidationMessageFor(m => m.UserName)
                </li>
                <li>
                    @Html.LabelFor(m => m.CompanyCode)
                    @Html.TextBoxFor(m => m.CompanyCode)
                    @Html.ValidationMessageFor(m => m.CompanyCode)
                </li>
                <li>
                    @Html.LabelFor(m => m.Password)
                    @Html.PasswordFor(m => m.Password)
                    @Html.ValidationMessageFor(m => m.Password)
                </li>
                <li>
                    @Html.CheckBoxFor(m => m.RememberMe)
                    @Html.LabelFor(m => m.RememberMe, new { @class = "checkbox" })
                </li>
            </ol>
            <input type="submit" value="Log in" />
        </fieldset>
    }
    </section>
}

@(Html.Kendo().MobileApplication()
    .ServerNavigation(true)
)

ADDITIONAL NOTES:

I determined that the cause of the malfunctioning Login button is the fact that the form produced by BeginForm is empty and reads as such:

<form action="/Account/Login" method="post"></form>

Any ideas why the form is coming up empty?
Steven
Top achievements
Rank 1
 asked on 26 Aug 2013
4 answers
382 views
Hi,

As a part of a report I have a chart that displays both negative and positive values (see attachment), which seems to work fine :) However, I need to place the axis labels at the bottom, and not in the center (0) as they are right now. I came across an older post saying that this was not possible at that time (around mid to late 2012), but I was hoping this was sorted by now?

Here's my chart code:
@(Html.Kendo().Chart()
      .Name("chart")
      .Theme("silver")
      .Legend(legend => legend.Visible(false))
      .ChartArea(chartArea => chartArea
                                  .Background("transparent")
      )
      .Series(series =>
          {
              series.Area(@Model.Weight).Name("Weight");
          })
      .ValueAxis(axis => axis
                             .Numeric("depth")
                             .Labels(labels => labels.Format("{0}kN"))
                             .AxisCrossingValue(0)
                             .Line(line => line.Visible(false))
                              
      )
      .CategoryAxis(axis => axis
                                .AxisCrossingValue(0,0,0,10)
                                .Categories(@Model.Depth)
                                .MajorGridLines(lines => lines.Visible(true))
      )
      .Tooltip(tooltip => tooltip
                              .Visible(true)
                              .Format("{0}%")
                              .Template("#= series.name #: #= value #")
      )
      )
If this is still not supported, I'd greatly appreciate a possible workaround as this is much needed functionality :)
Thanks in advance!
Ian
Top achievements
Rank 2
 answered on 23 Aug 2013
1 answer
206 views
Uncaught Error: Syntax error, unrecognized expression: input:hidden[name='Sections\[0\']\.Settings\[0\]\.Value] jquery.min.js:4

The HTML it's failing on is as follows:

<input data-val="true" data-val-required="The Boolean field is required." id="Sections_0__Settings_0__Value" name="Sections[0].Settings[0].Value" type="checkbox" value="true" />
<input name="Sections[0].Settings[0].Value" type="hidden" value="false" /> 
<span class="field-validation-valid" data-valmsg-for="Sections[0].Settings[0].Value" data-valmsg-replace="true"></span>

Can this be fixed ASAP
Rosen
Telerik team
 answered on 23 Aug 2013
7 answers
323 views
Hello,
it is possible to use the edit and delete buttons,but to put my own action,a javascript function,when i click on them?
i want to use them,because they already have their style(image and color) ,OR to create custom buttons just like the edit/delete buttons,with my own handler when i click on them.

Regards,
Daniel
Max
Top achievements
Rank 1
 answered on 23 Aug 2013
1 answer
454 views
Hello,
I would like to know if there are some examples on how to create a Master Detail Page with Kendo UI. This is what I would like to have:

1) A Grid acting as the master, displaying master rows with buttons for adding, updating and deleting records.

2) Under the Grid I would like to have a PartialView? showing a form details where the user can view the detail data of the selected grid row
, enter data for a new entry, update the details of the selected grid row.

Best Regards
Petur Subev
Telerik team
 answered on 22 Aug 2013
1 answer
480 views
I have been using inline edit with the Grid control in several projects for a while now and everything has worked great.  However, on a new page I have a grid that uses inline editing/creation, however when create is called via Ajax, all of the rows are passed into the controller action and my code is duplicating all the records.  I have compared this page with the pages that work correctly and I cannot seem to find the issue.  I must be missing something.  I think I just need another set of eyes.  Below is the code in the page/controller that is NOT working.

@model SS.Web.Models.SystemCustomerConcernViewModel
@{
    ViewBag.Title = "SystemCustomerConcern";
}
<section class="contentTitle">
    Customer Concern List
</section>
@(Html.Kendo().Grid<SS.Web.Models.SystemCustomerConcernViewModel>()
    .Name("SystemCustomerConcernGrid")
    .Columns(columns =>
    {
        columns.Command(command => command.Destroy()).Width(90).HtmlAttributes(new { style = "vertical-align: top;" });
        columns.Bound(p => p.SystemCategoryType).ClientTemplate("#=SystemCategoryType.description#").Width(160).HtmlAttributes(new { style = "vertical-align: top;" });
        columns.Bound(i => i.customerConcern).HtmlAttributes(new { style = "vertical-align: top;" });
        columns.Bound(i => i.billedHours).Width(100).HtmlAttributes(new { style = "vertical-align: top;" });
        columns.Bound(i => i.techPayHours).Width(115).HtmlAttributes(new { style = "vertical-align: top;" });
        columns.Bound(i => i.servicePerformed);
    })
    .ToolBar(toolBar =>
    {
        toolBar.Create();
        toolBar.Save();
    })
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .HtmlAttributes(new { style = "height: 675px" })
    .Pageable()
    .Sortable()
    .Scrollable()
    .Navigatable() //set so user can tab between cells in edit mode
    .DataSource(dataSource => dataSource
                                .Ajax()
                                .Events(events => events.Error("error_handler"))
                                .PageSize(100)
                                .Batch(true)
                                .ServerOperation(false)
                                .Model(model =>
                                {
                                    model.Id(i => i.systemCustomerConcernID);
                                    model.Field(p => p.SystemCategoryType).DefaultValue(
                                        ViewData["defaultSystemCategoryType"] as SS.Web.Models.SystemCategoryTypeViewModel); //this is used when you add a new item
                                })
                                        .Read(read => read.Action("List", "SystemCustomerConcern"))
                                        .Create(create => create.Action("Create", "SystemCustomerConcern"))
                                        .Update(update => update.Action("Update", "SystemCustomerConcern"))
                                        .Destroy(destroy => destroy.Action("Delete", "SystemCustomerConcern"))
                                ))
<script type="text/javascript">
    function error_handler(e) {
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function () {
                        message += this + "\n";
                    });
                }
            });
            alert(message);
        }
    }
</script>



[AcceptVerbs(HttpVerbs.Post)]
        public ActionResult Create([DataSourceRequest] DataSourceRequest request,
            [Bind(Prefix = "models")]IEnumerable<SystemCustomerConcernViewModel> systemCustomerConcerns)
        {
            var results = new List<SystemCustomerConcernViewModel>();

            if (systemCustomerConcerns != null && ModelState.IsValid)
            {
                foreach (var systemCustomerConcernViewModel in systemCustomerConcerns)
                {
                    SystemCustomerConcern systemCustomerConcern = new SystemCustomerConcern
                    {
                        customerConcern = systemCustomerConcernViewModel.customerConcern,
                        billedHours = systemCustomerConcernViewModel.billedHours,
                        techPayHours = systemCustomerConcernViewModel.techPayHours,
                        servicePerformed = systemCustomerConcernViewModel.servicePerformed,
                        isActive = systemCustomerConcernViewModel.isActive,
                        systemCategoryTypeID = systemCustomerConcernViewModel.SystemCategoryType.systemCategoryTypeID
                    };

                    systemCustomerConcernViewModel.systemCustomerConcernID = this.systemCustomerConcernService.Create(systemCustomerConcern);
                    results.Add(systemCustomerConcernViewModel);
                }
            }

            return Json(results.ToDataSourceResult(request, ModelState));
        }

Daniel
Telerik team
 answered on 22 Aug 2013
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
ComboBox
Upload
MultiSelect
ListView
Window
TabStrip
Menu
Installer and VS Extensions
Spreadsheet
AutoComplete
TreeList
Gantt
PanelBar
NumericTextBox
Filter
ToolTip
Map
Diagram
Button
PivotGrid
Form
ListBox
Splitter
Application
FileManager
Sortable
Calendar
View
MaskedTextBox
PDFViewer
TextBox
Toolbar
Dialog
MultiColumnComboBox
DropDownTree
Checkbox
Slider
Switch
Notification
Accessibility
ListView (Mobile)
Pager
Security
ColorPicker
DateRangePicker
Wizard
Styling
Chat
DateInput
MediaPlayer
TileLayout
Drawer
SplitView
Template
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Badge
LinearGauge
ModalView
ResponsivePanel
TextArea
Breadcrumb
ExpansionPanel
Licensing
Rating
ScrollView
ButtonGroup
CheckBoxGroup
NavBar
ProgressBar
QRCode
RadioButton
Scroller
Timeline
TreeMap
TaskBoard
OrgChart
Captcha
ActionSheet
Signature
DateTimePicker
AppBar
BottomNavigation
Card
FloatingActionButton
Localization
MultiViewCalendar
PopOver (Mobile)
Ripple
ScrollView (Mobile)
Switch (Mobile)
PivotGridV2
FlatColorPicker
ColorPalette
DropDownButton
AIPrompt
PropertyGrid
ActionSheet (Mobile)
BulletGraph
Button (Mobile)
Collapsible
Loader
CircularGauge
SkeletonContainer
Popover
HeatMap
Avatar
ColorGradient
CircularProgressBar
SplitButton
StackLayout
TimeDurationPicker
Chip
ChipList
DockManager
ToggleButton
Sankey
OTPInput
ChartWizard
SpeechToTextButton
InlineAIPrompt
TimePicker
StockChart
RadialGauge
ContextMenu
ArcGauge
AICodingAssistant
SmartPasteButton
PromptBox
SegmentedControl
LLM Kit
+? more
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Simon
Top achievements
Rank 2
Iron
Iron
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Marco
Top achievements
Rank 4
Iron
Iron
Iron
Grant
Top achievements
Rank 3
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?