Telerik Forums
UI for ASP.NET MVC Forum
1 answer
589 views

 We are working with “Jquery Kendo Grid” with asp.net MVC 4.0. We need your help on few things. Please help us with some samples.

 

  1. Need to Display Dynamic Column Kendo  Grid( Columns of the Grid will vary for different users)
  • How can I pass the Column details to “View” from “Controller”
  • How can I bind the column details to  “Jquery Kendo  Grid” in View
  • How can I pass the Data to “View” from “Controller”
  • How can I bind the Data to  “Jquery Kendo  Grid” in View
  1. Need to allow user to edit the Data in Dynamic Grid and save this only when user click on the SAVE button
  • How do I pass the EDITED Data from View to Controller?
  • How should I write my Controller Action to receive the Data sent from View. I don’t know the format of the data which View will send to Controller?
  1. Need to allow user to Delete the Data in Dynamic Grid and save this only when user click on the SAVE button
  • How do I pass the DELETED Data from View to Controller?
  • How should I write my Controller Action to receive the Data sent from View. I don’t know the format of the data which View will send to Controller?
  1. Need Column chooser / Resize / Re order also in Dynamic Grid
  • We should allow the user “Select / Unselect” the column which user needed in Dynamic Grid
  • We should allow the user “Reorder” the column  in Dynamic Grid
  • We should allow the user  to “Resize”  the column  in Dynamic Grid
  •  We should allow the user SAVE the preferences (List of the needed column, width of the column and order of the column) which he has made on the “Dynamic Grid”  to database, so that  when user login next time, we can show the Grid as user had preferred (customized) last time​
Hristo Valyavicharski
Telerik team
 answered on 21 Jul 2015
1 answer
147 views
When we add Kendo drop down in a kendo grid (inside Client Template) and run the application. Text box appears inside the column instead of  Kendo drop down. Can you guide us?
BAJIVALI
Top achievements
Rank 1
 answered on 20 Jul 2015
1 answer
1.8K+ views
I have a start date and end date validation where user can not choose a end date previous that of start date. I have written code on datepicker change event and it is working fine. But if i have already have value in the start date from the model and didnt pick from the datepicker, on end date change event the value of start date is null.
View Code/ works fine if the value is picked from datepicker
 
    <div class="form-group">
          @Html.LabelFor(model => model.StartDate, htmlAttributes: new { @class = "control-label col-md-2 k-label" })
          <div class="col-md-10">    
              @(Html.Kendo().DatePicker().Name("StartDate").Value(Model.StartDate).HtmlAttributes(new { style = "width:250px", onkeydown = "javascript:return false;", required = "required" }).Events(e => e.Change("startChange"))) 
         
              @Html.ValidationMessageFor(model => model.StartDate, "", new { @class = "text-danger" })
          </div>
      </div>
 
      <div class="form-group">
          @Html.LabelFor(model => model.EndDate, htmlAttributes: new { @class = "control-label col-md-2 k-label" })
          <div class="col-md-10">
              @(Html.Kendo().DatePicker().Name("EndDate").Value(Model.EndDate).HtmlAttributes(new { style = "width:250px", onkeydown = "javascript:return false;" }).Events(e => e.Change("endChange")))               
     
              @Html.ValidationMessageFor(model => model.EndDate, "", new { @class = "text-danger" })
          </div>
      </div>
 
 
function startChange() {    
      var endPicker = $("#EndDate").data("kendoDatePicker"),
          startDate = this.value();
      if (startDate) {
          startDate = new Date(startDate);
          startDate.setDate(startDate.getDate() + 1);
          endPicker.min(startDate);
      }
  }
 
  function endChange() {      
      var startPicker = $("#StartDate").data("kendoDatePicker"),
          endDate = this.value();      
      if (endDate) {
          endDate = new Date(endDate);
          endDate.setDate(endDate.getDate() - 1);
          startPicker.max(endDate);
      }
  }
Georgi Krustev
Telerik team
 answered on 20 Jul 2015
3 answers
186 views

Hi,

I thought I'd ask on here first, but I am struggling to find any nice way to paste into the grid selected cells. 

 I am using multiple cell selection:

 

.Selectable(selectable => selectable.Enabled(true)
                .Mode(GridSelectionMode.Multiple)
                .Type(GridSelectionType.Cell))

I am anticipating I need to manually handle the paste event by registering for the paste event.

    $(function () {
 
        $("#weldgrid").bind("paste", function (e) {
         
        var pastedText = undefined;
            if (window.clipboardData && window.clipboardData.getData) {
                pastedText = window.clipboardData.getData('Text');
            } else if (e.clipboardData && e.clipboardData.getData) {
                pastedText = e.clipboardData.getData('text/plain');
            }
 
    // TODO:  Process input for tab/newlines
 
   // iterate through selected cells
   // write associated value to each one
 
    }
}
 

I've come across this thread already which went dead after one response.

http://www.telerik.com/forums/copy-and-paste-rows-in-kendo-ui-asp-net-mvc-grid

For me the demo does not work and the API Docs in IE11 are all over the place.  I am struggling to find my way around the layout/structure of the pages.

Now my question is, how can I nicely iterate through each cell in the range and set the value?

I can see that:

var grid = $("#grid").data("kendoGrid");
            var currentSelection = grid.select();
 
            currentSelection.each(function () {
    // $(this) is the selected cell
}

 

Thanks

Andez

 

 

Atanas Georgiev
Telerik team
 answered on 20 Jul 2015
4 answers
80 views
Hello I am relatively new to the Kendo UI for Asp.net MVC components.  I searched for a solution to my problem, but maybe I am not searching on the correct terms.  I have a Customer Grid and you can select a particular customer which will take you to the details page for that customer.  I want to have a grid on the details page that contains information about table that is related to that customer (for instance I want a grid listing the ShipTo items).  I am looking for examples.  I can do this using knockoutjs without much effort, but they want to use the Kendo grid (they paid for it etc) :-)  Any suggestions?
Dimiter Madjarov
Telerik team
 answered on 20 Jul 2015
1 answer
111 views

I have a simple model bound grid with Edit and Destroy commands with Inline editing set.

When I click on Edit, then Cancel, I expect the row to be exit out of editing mode and the row data stays the same.

 

However what I am seeing is the grid is deleting the row.

 

I have checked that no destroy methods are being called.

Kiril Nikolov
Telerik team
 answered on 20 Jul 2015
7 answers
178 views
can someone tell me what could cause the issue of my text editor?  it goes haywires.  Here is our partial code of the editor.

<div class='tab-content k-widget'>
            @Html.ValidationSummary()
    
            @using (Rite.FormTable())
            {
                using (Rite.FormColumn(classCss: "editorWidth"))
                {
                    @(Html.Kendo().Editor()
                                .Name("Message")
                                .HtmlAttributes(new
                                      {
                                          @class = changeTrack,
                                          data_bind = "value: Message",
                                          style = "width: 800px; height:600px",
                                      })
                                .Tools(t => t.Clear()
                                          .Bold()
                                          .Italic()
                                          .Underline()
                                          .FontColor()
                                          .FontName()
                                          .FontSize()
                                          .JustifyLeft()
                                          .JustifyCenter()
                                          .JustifyRight()
                                          .JustifyFull()
                                          .InsertUnorderedList()
                                          .InsertOrderedList()
                                          .Indent()
                                          .Outdent()
                                          .CreateLink()
                                          .Unlink()
                                          .SubScript()
                                          .SuperScript()
                                          .InsertImage()
                                        )
                    )
                }
Dimo
Telerik team
 answered on 20 Jul 2015
1 answer
452 views

I've set up a grid with a required foreign key by creating a copy of the GridForeignKey editor template and adding .HtmlAttributes(new { required="required" }) and applying that editor template to the foreign key column.

This seems to work nicely however the validation message i get on the grid is "ClientID is required". How do i set this up to refer to the required field by its column title rather than the name in the model.

Thanks

Graeme

Plamen Lazarov
Telerik team
 answered on 17 Jul 2015
1 answer
242 views
I’m having trouble with a ComboBox dropdown area not scrolling under certain circumstances.
Below is the code in my MVC View (.cshtml):
           
<div class="field">
    @Html.LabelFor(m => m.WeightUnitMeasureCode)
    @(Html.Kendo().ComboBoxFor(m => m.WeightUnitMeasureCode)
        .Filter(FilterType.Contains)
        .Suggest(true)
        .DataTextField("Name")
        .DataValueField("Value")
        .DataSource(source =>
        {
            source.Read(read =>
            {
                read.Action("GetUnitMeasures", "UiLists", new { area = "" });
            });
        })
    )
</div>

After page load, clicking the down arrow on the control opens the dropdown list but it is so long that it run out of view. (see image1)
If I select an item in the list and click the down arrow again, the problem persists.
However, if I manually clear the text of the selected item in the control, the dropdown opens automatically and it behaves as desired with a max height of 200px (see image2)

The screenshots show that I'm using these in a custom modal window however this issue occurs even on a regular page.
Any ideas on what I’m doing wrong or how to fix this?

Georgi Krustev
Telerik team
 answered on 17 Jul 2015
1 answer
545 views

I currently am using buttons on my view for the menu.  So along the top of my view I have 

 

@(Html.Kendo().Button()
    .Name("btnAddTeacher")
    .HtmlAttributes(new { type = "submit", value = "AddTeacher", name = "Command", title = "Add Teacher" })
    .ImageUrl(Url.Content("~/Images/add-student-35.png"))
    .Enable(ElementaryProgress.Classes.Security.AllowSchoolEdit)
)

 

Now I would like to replace these buttons with a menu.  However I can't seem to figure out how to pass the model within my routevalues in the call to the action.  So my menu item looks like:

@(Html.Kendo().Menu()
     .Name("menu")
     .Items(items =>
     {
         items.Add()
           .Text("Teacher")
           .Items(c =>
           {
                c.Add()
                    .Text("Add Teacher")
                    .ImageUrl("~/Images/add-student-35.png")
                    .Enabled(ElementaryProgress.Classes.Security.AllowSchoolEdit)
                    .Action("EditMySchool", "School", new { vm=this.Model, Command="AddTeacher" });
            });
 
     })
)
 

 So the problem is that when the call is made to my action on my controller, the parameter vm is null.  So how do I set vm equal to the model on the view so that I can pass my viewmodel back to my controller?

 

Thanks in advance,

Lee

 

 

Daniel
Telerik team
 answered on 17 Jul 2015
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
Security
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
SegmentedControl
+? more
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Boardy
Top achievements
Rank 2
Veteran
Iron
Benjamin
Top achievements
Rank 3
Bronze
Iron
Veteran
ivory
Top achievements
Rank 1
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
ClausDC
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?