Telerik Forums
UI for ASP.NET MVC Forum
1 answer
149 views
when I make a treelist as grid detail template  and click the create button 
I got  an error like   TypeError: parent is undefined  kendo.all.js--line:103021
any way to solve it?

Thanks!
Nikolay Rusev
Telerik team
 answered on 10 Dec 2014
1 answer
216 views
I've got a chart defined as:-

@(Html.Kendo().Chart<WT_Portal_PMS2.Models.OpenClockSummary>()
       .Name("chart")
       .Title("Open Clocks by Weeks Waiting")
       .Theme("bootstrap")
       .Legend(legend => legend
           .Position(ChartLegendPosition.Top)
           .Visible(false)
       )
                   .DataSource(ds => ds.Read(read => read.Action("_BarChartp", "Summary")
                              .Data("specFilter")
 
                   ))
       .Series(series =>
       {
           series.Column(model => model.Clocks, model => model.barColour);
 
 
 
       })
       .ChartArea(area => area
           .Height(350)
           .Background("transparent"))
       .CategoryAxis(axis => axis
           .Categories(model => model.CurrentWaitingBand)
           .Labels(labels => labels.Rotation(-90))
           .MajorGridLines(lines => lines.Visible(false))
       )
       .ValueAxis(axis => axis.Numeric()
           .Labels(labels => labels.Format("{0:N0}"))
           .Line(line => line.Visible(false))
       )
       .Tooltip(tooltip => tooltip
           .Visible(true)
           .Format("{0:N0}")
       )
 
                   )

What I need to do is add a boostrap badge to the chart title, so each one of the charts has an easily idfentifiable reference number.
E.g:-
<span>Open Clocks by Weeks Waiting</span>  <span class="pull-right badge">C1</span>

How can I put this markup into the title? Any attempt to add spans etc., result in javascript errors when the page is run.

Thanks
T. Tsonev
Telerik team
 answered on 10 Dec 2014
1 answer
673 views
Hello,

I am displaying  popup window from parent displaying a  partial view. When the partial view loads my parent window URL is already changing to Controller/Action for partialview. When i submit the partial view i do not want to refresh the parents window. Submitting partial view should just Close Pop up  window. How can i achieve this. parent window method to Show popup window code is like this
var direction = "ObjectDetail/Index";
var wnd = $("#ObjectDetail").data("kendoWindow");
if (wnd) {
wnd.refresh({
url: direction,
data: { id: item.id }

});
wnd.element.css("visibility", "");
wnd.center();
wnd.open();
}
At this Point when child window Pops up parent window URL is changing to this new URL.

The partial view has beginform
@using (Html.BeginForm("SubmitFormCollection", "ObjectDetail"))
{
and on submit the actionresult i have to Redirect to parent URL again and this refreshes parent view
      [AcceptVerbs(HttpVerbs.Post)]
         public ActionResult SubmitFormCollection(ControlsContext selModel, FormCollection formCollection)
         {
   //do something
              return RedirectToAction("Index", "ObjektActivity");         }

How can i submit the popup window and Close it without refreshing parent.

Anamika
Anamika
Top achievements
Rank 1
 answered on 09 Dec 2014
1 answer
231 views
I am trying to filter the Grid based on what the user types.  One of my fields is a drop down list and if the foreignKey ID is null the filter breaks because it cannot get the value.  

The field is Gender.  Is there a way to first check if Gender_Id is null before I check Gender_Types.Gender?  Because if Gender_Id is null then so is Gender_Types.

Here is my code:



// Filter the Grid as a user types
    $("#Search").on("keyup click input", function () {
        grid = $("#Grid").data("kendoGrid");
        var searchFilter = { logic: "and", filters: [] };

        if (this.value.length > 0) {
            var search = this.value.trim();
            var search_array = search.split(" ");
            for (var i = 0; i < search_array.length; i++) {
                var filter = { logic: "or", filters: [] };

                filter.filters.push({ field: "Full_Name", operator: "contains", value: search_array[i] });
                filter.filters.push({ field: "Gender_Types.Gender", operator: "contains", value: search_array[i] });

                searchFilter.filters.push(filter);
            }

            grid.dataSource.query({ filter: searchFilter });

            // When done filtering select page one otherwise no page is selected
            grid.dataSource.page(1);

        } else {
            grid.dataSource.query({ filter: searchFilter });

            // When done filtering select page one otherwise no page is selected
            grid.dataSource.page(1);
        }
    });











Petur Subev
Telerik team
 answered on 09 Dec 2014
1 answer
204 views
Hello,

I'm trying to show the redline you can see in timeline view at http://www.telerik.com/kendo-ui/ganttchart (also in attached file).
How I can do it? I don't see any option to enable it. I'm actually not using Dependencies between task or additional Resource.

Anyway, it's supposed to show the actual time (today) from the timeline? or what's his purpose?
Vladimir Iliev
Telerik team
 answered on 08 Dec 2014
1 answer
137 views
I have a script like this:

$.ajax(
    {
        url: '@Url.Action("GetThrowData", "UserConsoleViewModels")',
        type: 'POST',
        dataType: 'json',
        data:
        {
            throwId: _throwId
        }
    }
    ).done(
        function (response) {
            console.log(response);
            $("#direction").text(response.Data.Action);
            $("#lblRawData").text(response.Data.RawData);
        }
    ).error(
        function (xhr, status, error) {
            alert(xhr.responseText);
    }
);                       


Right now the RawData property (a comma delimited list of floats) is just being printed to a label.  What I would like to do is apply it as a series in a chart similar to this:

@(Html.Kendo().Chart()
  .Name("currentGraph")
  .Title("Switch Current Graph")
  .Legend(legend => legend
      .Position(ChartLegendPosition.Bottom)
  
  .ValueAxis(axis => axis.Numeric()
      .Labels(labels => labels.Format("{0}"))
      .Title("Current")
  ).HtmlAttributes(new { style = "height:300px" })
  .Tooltip(tooltip => tooltip
      .Visible(true)
      .Format("{0}")
  )
)


How would I do that?
Hristo Germanov
Telerik team
 answered on 08 Dec 2014
1 answer
184 views
Hi,

We are right now in the trial period of the Telerik MVC suite.
We tried binding Kendo Pivot Grid using MVC by referring examples available on 
http://demos.telerik.com/aspnet-mvc/pivotgrid/local-flat-data-binding (showing data binding using XML).
We need to bind list data to view. Please provide some examples which will bind List format data returned by model to view in ASP.NET MVC4. 

This would help us a lot in the evaluation process.

Thanks and regards,
Vaibhavi Shinde
Georgi Krustev
Telerik team
 answered on 08 Dec 2014
1 answer
193 views
My custom editor template consists of a table with one row of two columns. Each of those columns have a table. The two tables have a one to one relationship. All CRUD operations are working fine, concerning Inserts, Updates, and Deletes. My only complaint is appearance. I can't get the kendo created and controlled Update and Cancel buttons to float all the way to the right after exhausting ever example I could find. 

I've tried:
.k-edit-buttons {
    float: right;
}

didn't work. It puts the buttons about half way there. The code in my form looks like the following:

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    <table id="crossarm_values" style="height: 500px; margin: 20px 20px 20px 40px; background-color: rgba(10, 10, 10, 0.11);" class="ui-grid-b ui-corner-all ui-shadow ui-dialog-titlebar">
        <tr id="crossarm_data">
            <td style="width: 375px; height: 475px; margin: 1px 1px 1px 1px;">
                <fieldset id="master">
                    <legend style="font-family: 'Bookman Old Style'; color:orangered; font-weight: bold; font-size:16px; border: none;">Master Crossarm Data</legend>
                    <table style="font-size: 12px; color:black; width: 325px; height: 375px; margin-bottom: 85px; margin-left: 20px;">
                        @Html.HiddenFor(e => e.EquipmentId)
                        <tr style="margin-left: 1px; margin-right: 5px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.EquipmentName)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(e => e.EquipmentName)
                            </td>
                        </tr>
                        <tr style="margin-left: 1px; margin-right: 5px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.EquipmentDescription)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(e => e.EquipmentDescription)
                            </td>
                        </tr>
                        <tr style="margin-left: 1px; margin-right: 5px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(c => c.Category)
                            </td>
                            <td style="width: 130px;">
                                @Html.DropDownListFor(c => c.Category, Model.CategoryTypes)
                            </td>
                        </tr>
                        <tr style="margin-left: 1px;margin-right: 5px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.EquipmentType)
                            </td>
                            <td style="width: 130px;">
                                @Html.DropDownListFor(t => t.EquipmentType, Model.CrossarmTypes, "-- Select A Type --")
                            </td>
                        </tr>
                        <tr style="margin-left: 1px;margin-right: 5px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.Length)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(e => e.Length)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.Height)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(e => e.Height)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.Width)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(e => e.Width)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.CanEditLength)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(e => e.CanEditLength)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.CanEditHeight)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(e => e.CanEditHeight)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.CanEditWidth)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(e => e.CanEditWidth)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px; margin-right: 5px; width: 150px;">
                                @Html.LabelFor(e => e.IsObsolete)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(e => e.IsObsolete)
                            </td>
                        </tr>
                    </table>
                </fieldset>
            </td>
            <td style="width: 50px; padding: 15px 15px 15px 15px;"></td>
            <td style="width: 325px; height: 475px; margin: 1px 1px 1px 1px; float: right;">
                <fieldset id="detail">
                    <legend style="font-family: 'Bookman Old Style'; color:orangered; font-weight: bold; font-size:16px;">Detail Crossarm Data</legend>
                    <table style="font-size: 12px; color:black; width: 300px; height: 465px; margin-left: 10px;">
                        @Html.HiddenFor(c => c.CrossarmId)
                        <tr style="margin-left: 1px; margin-right: 5px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.AttachOffset)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.AttachOffset)
                            </td>
                        </tr>
                        <tr style="margin-left: 1px;margin-right: 5px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.AttachSlope)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.AttachSlope)
                            </td>
                        </tr>
                        <tr style="margin-left: 1px;margin-right: 5px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.CanAttachOffset)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.CanAttachOffset)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.CanAttachSlope)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.CanAttachSlope)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.Number, null, new { pattern = @"\d{0, 12}" })
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.Number)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.Weight)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.Weight)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.Slope)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.Slope)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.VerticalOffset)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.VerticalOffset)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.HasBrace)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.HasBrace)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.HorizontalBraceSpace)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.HorizontalBraceSpace)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.VerticalBraceSpace)
                            </td>
                            <td style="width: 130px;">
                                @Html.EditorFor(c => c.VerticalBraceSpace)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(s => s.Species)
                            </td>
                            <td style="width: 130px;">
                                @Html.DropDownListFor(s => s.Species, Model.SpeciesTypes)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.Quantity)
                            </td>
                            <td style="width: 40px;">
                                @Html.EditorFor(c => c.Quantity)
                            </td>
                        </tr>
                        <tr style="width: 275px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @Html.LabelFor(c => c.CrossarmSortOrder)
                            </td>
                            <td style="width: 40px;">
                                @Html.EditorFor(c => c.CrossarmSortOrder)
                            </td>
                        </tr>
                        <tr style="margin-left: 1px; margin-right: 5px;">
                            <td style="margin-left: 1px;margin-right: 5px; width: 175px;">
                                @*@Html.LabelFor(c => c.EquipmentName)*@
                            </td>
                            <td style="width: 130px;">
                                @*@Html.EditorFor(e => e.EquipmentName, new { disabled = "disabled", @readonly = "readonly" })*@
                                @*@Html.DisplayFor(e => e.EquipmentName)*@
                            </td>
                        </tr>
                    </table>
                </fieldset>
            </td>
        </tr>
        <tr id="crossarm_list" style="display: none">
            @foreach (var item in @ViewBag.Crossarms)
            {
                <td>@item</td>
            }
        </tr>
    </table>

}










Alexander Popov
Telerik team
 answered on 08 Dec 2014
0 answers
244 views
I have 3 date attributes defined as timestamp with timezone in Oracle database. I ise EF 5.0 and LINQ to get the data from Oracle and it works fine. I have defined the attributes in my VM As DateTimeOffset and I can populate them without any issues. However when I try to bind them to DateTimePicker in my EditorTemplate it breaks and crashes the page.

Is this not supported? If so what alternatives do I have. Does anyone have an example that I can see.

I am doing a basic MVC app using EF 5.0 and using LINQ to get the data using repository patter.

Here is a snippet of my code.

VM
[DisplayName("Activate Date")]
public DateTimeOffset? activateDate { get; set; }
 
[DisplayName("Inactivate Date")]
public DateTimeOffset? inactivateDate { get; set; }
 
[DisplayName("Energizing Date")]
public DateTimeOffset? energizingDate { get; set; }

DAO
var x = dao.CONNECTIVITY_UNIT
       .Join(dao.OP_AREA_ORG, cu => cu.OP_AREA_CODE, oa => oa.OP_AREA_CODE, (cu, oa) => new { CONNECTIVITY_UNIT = cu, OP_AREA_ORG = oa })
       .Where(w => w.CONNECTIVITY_UNIT.UNIT_TYPE.Equals("SUBSTATION"))
       .Where(w => w.CONNECTIVITY_UNIT.IS_ACTIVE_FLAG.ToUpper().Equals("Y"))
       .Where(w => w.CONNECTIVITY_UNIT.ABBR.ToUpper().Equals("BRA"))
       .Select(c => new SubstationVM
       {
          energizingDate = c.CONNECTIVITY_UNIT.ENERGIZING_DATE,
          activateDate = c.CONNECTIVITY_UNIT.ACTIVATE_DATE,
          inactivateDate = c.CONNECTIVITY_UNIT.INACTIVATE_DATE,                           
          updateTime = c.CONNECTIVITY_UNIT.UPDATE_TMSTMP
       })
       .OrderBy(o => o.substationABBR)
       .ToList();
 
return x;


View EditorTemplate
<div class="form-group">
    @Html.LabelFor(model => model.energizingDate, new { @class = "control-label col-xs-2" })
    <div class="col-xs-2">
        @Html.EditorFor(model => model.energizingDate)
        @Html.ValidationMessageFor(model => model.energizingDate)
    </div>
    <div class="col-xs-3">
        <div class="form-group">
            @Html.LabelFor(model => model.activateDate, new { @class = "control-label col-xs-4" })
            <div class="col-xs-7">
                @Html.EditorFor(model => model.activateDate)
                @Html.ValidationMessageFor(model => model.activateDate)
            </div>
        </div>
    </div>
    <div class="col-xs-3">
        <div class="form-group">
            @Html.LabelFor(model => model.inactivateDate, new { @class = "control-label col-xs-4" })
            <div class="col-xs-7">
                @Html.EditorFor(model => model.inactivateDate)
                @Html.ValidationMessageFor(model => model.inactivateDate)
            </div>
        </div>
    </div>
</div>


Am I missing anything? Is there another or better way of doing this?

Thanks for the help.
Hemal Shah
Top achievements
Rank 1
 asked on 05 Dec 2014
3 answers
120 views
I have a grid and event like this.  The text placed in a label in the last line of the script depends upon which of two columns got clicked; HomeAddress or BizAddress.  .If the user clicked the Name column instead of one of the two address columns, I want to do nothing.

How can I tell that so I can pick which field to put in the label text?

@(Html.Kendo().Grid<AppUser>()
      .Name("grid")
      .Columns(columns =>
      {
          columns.Bound(c => c.Name).Width(140);
          columns.Bound(c => c.HomeAddress).Width(140);
          columns.Bound(c => c.BizAddress).Width(140);
      })
      .HtmlAttributes(new { style = "height: 380px;" })
      .Scrollable()
      .Groupable()
      .Sortable()
      .Selectable()
      .Events(events => events.Change("grid_change"))
      .Pageable(pageable => pageable
          .Refresh(true)
          .PageSizes(true)
          .ButtonCount(5))
      .DataSource(dataSource => dataSource
          .Ajax()
          .Read(read => read.Action("FilteredPeople_Read", "UserConsoleViewModels"))
      )
)
<script>
    function grid_change(e) {
        var data = this.dataItem(this.select());
        if (clickedColumnIndex != 0)  // How do I find selectedColumnIndex?
        {
            $("#labelName").text(data.Name);       
            $("#labelAddress").text(selectedColumnIndex == 1 ? data.HomeAddress : data.BizAddress); 
        }
    }
</script>
Dimiter Madjarov
Telerik team
 answered on 05 Dec 2014
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
MultiColumnComboBox
Dialog
DropDownTree
Checkbox
Slider
Switch
Notification
Accessibility
ListView (Mobile)
Pager
ColorPicker
DateRangePicker
Wizard
Security
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
+? more
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?