Telerik Forums
UI for ASP.NET MVC Forum
3 answers
1.9K+ views

Hi,

I'm experimenting with the following grid and want to know if its possible to change the editor assosiated with the UserInputString column when the Field column value changes.

 

That is the Field column consists of a drop down list for example containing "Job Number", "Client", "Product" and other items. When the user selects, for example, Job Number the UserInputString editor is to be a TextBox. If Product is selected, the input will be a product auto complete text box, if 'Is Invoiced' is selected it will be a check box etc.

 

Is this possbile?

 

 

 @(Html.Kendo().Grid<S3Web.Models.AdvancedSearchModel>()
        .Name("grid")
        .Columns(columns =>
        {
          columns.Bound(p => p.AndOrString);
          columns.Bound(p => p.StartBracketString);
          columns.Bound(p => p.Field).Width(180);
          columns.Bound(p => p.OperatorString);
          columns.Bound(p => p.UserInputString);
          columns.Bound(p => p.EndBrackerString);
          columns.Command(command => command.Destroy()).Width(150);
        })
          .ToolBar(toolBar =>
          {
            toolBar.Create();
            toolBar.Save();
          })
        .Editable(editable => editable.Mode(GridEditMode.InCell))
        .DataSource(dataSource => dataSource
            .Ajax()
            .Batch(true)
            .ServerOperation(false)
            .Events(events => events.Error("error_handler"))
            .PageSize(20)
            .Read(read => read.Action("AdvancedSearch_Read", "Jobs"))
            .Create(create => create.Action("AdvancedSearch_Create", "Jobs"))
            .Update(update => update.Action("AdvancedSearch_Update", "Jobs"))
            .Model(model =>
            {
              model.Id(p => p.Field);
            })
        )
  )

 

Preslav
Telerik team
 answered on 21 Jun 2018
15 answers
4.3K+ views
Hello. I am hoping to get some help here, I'm stuck. I am trying to get the value from my dropdown list to my controller to save back to the db but the value doesn't seem to come back with the post. 

My Model
namespace MDT.Models
{
    public class Vehicle
    {
        [Key]
        public int VehicleID { get; set; }
 
        public int UserID { get; set; }
 
        [Required]
        [StringLength(50)]
        public string Name { get; set; }
 
        public int MakeID { get; set; }
        public int ModelID { get; set; }
 
        [DisplayName("Color")]
        public int ColorID { get; set; }
 
        [Required]
        [StringLength(4)]
        public string StickerKey { get; set; }
 
        [DefaultValue(true)]
        public Boolean IsActive { get; set; }
 
        public virtual CarColor CarColor { get; set; }
    }
 
}

My Controller action for the udpate
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit(Vehicle vehicle)
{
    if (ModelState.IsValid)
    {
        db.Entry(vehicle).State = EntityState.Modified;
        db.SaveChanges();
        return RedirectToAction("Index");
    }
    return View(vehicle);
}
My Kendo drop down list definition in the cshtml
<div class="editor-label">
    @Html.LabelFor(model => model.ColorID)
</div>
<div class="editor-field">
    @*@Html.EditorFor(model => model.ColorID)*@
    @Html.ValidationMessageFor(model => model.ColorID)
 
    @(Html.Kendo().DropDownListFor(model => model.ColorID)
        .BindTo(ViewData["CarColors"] as SelectList)
        .Name("kendocarcolor")
        .Value(Model.ColorID.ToString()) 
        .OptionLabel("Select a Color")             
    )
</div>

When I perform the save for the above, the ColorID comes back at zero. Shouldn't it be getting passed back with the updated model for the post? I also have noticed that my validator for the ColorID is not working for the Kendo Dropdown list but if I uncomment the EditorFor, it does work on that control.

If you could please help me with the following it would be greatly appreciated:

1) Why doesn't the dropdownlist come back with my updated model value to my controller?
2) Any ideas why the validator doesn't work?
3) Did I populate the dropdownlist the most efficent way using ViewData? How would you do it?

THANK YOU very much in advance.

Ivan Danchev
Telerik team
 answered on 21 Jun 2018
1 answer
956 views

Hi,

I used Kendo dialog, everything work fine, except the position. it seems that it doesn't impact. I changed the values in Percentages or in pixels but this is not working and it always appears in the same place.

What is the problem?

this is my code:

myWindowConfirmTransaction = $("#ConfirmTransactionWindow");
            myWindowConfirmTransaction.kendoDialog({
                width: "40%",
                height: "65%",
                title: "",
                closable: true,
                modal: true,
                visible: false,
                content: formHtmlData,
                actions: [
                    { text: 'Edit', action: onCancel },
                    { text: 'Continue', primary: true, action: onContinue }
                ],
                position: {
                    top: 10,
                    left: "25%"
                },
                animation: {
                    open: {
                        effects: "slideIn:down fadeIn",
                        duration: 1000
                    },
                    onCancel: {
                        effects: "slide:down fadeOut"
                    }
                }
            });
        }
        myWindowConfirmTransaction.data("kendoDialog").open().center();

 

thanks!

 

 

 

 

Ivan Zhekov
Telerik team
 answered on 20 Jun 2018
4 answers
636 views

Accessing the Selected DataText and DataValue

Please help...

@(Html.Kendo().ListBox()
.HtmlAttributes(new { title = "Accounts"})
.Name("ListAccounts")
.DataTextField("AccountName")
.DataValueField("AccountID")
.BindTo(Model)
.Events(events => events.Change("onChange"))
)

<script>
function onChange(e) {
var value = $("#ListAccounts").data("kendoListBox").dataSource._data[$("#ListAccounts").data("kendoListBox").selectedIndex].value;
GetFleetAssets(value);
}
</script>

How can i get the DataValueField "AccountID" for the selected item within an Event Script? I can see that the data is loaded by viewing the source.

script above does not function

Stefan
Telerik team
 answered on 20 Jun 2018
1 answer
3.5K+ views

I'm putting together a grid which displays results for a document search.  In the grid itself, instead of showing the row Id, I have a checkbox.  What I'd like to do is twofold:

1. Add a check box column header that'll select all rows when checked (I've seen examples that use a specific boolean field, which my grid doesn't have nor use...  I just want to go through each row displayed and check the checkbox, but it is not dependent upon any other column.

2. Get all the selected row IDs to pass into a controller.  Not really pertinent, but what that controller will do is look for corresponding rows in the database, extract the document information in order to zip them all up together.

Any help would be greatly appreciated...

Dimo
Telerik team
 answered on 18 Jun 2018
2 answers
402 views
My users are wanting a way to enlarge or resize the window that pops up when they click the View HTML button in the Editor widget. Is there a way to do this or is beyond the developer's control? Thanks.
Bryan
Top achievements
Rank 1
 answered on 15 Jun 2018
10 answers
708 views

I have a page where one grid has to have the possibility to add/remove rows on the client before saving all the changes to the server.

The grid is created like this

@(Html.Kendo().Grid(Model.AssignedObjects)
          .Name("AssignedGrid")
          .Columns(columns =>
          {
              columns.Select().Width(35);
              columns.Bound(p => p.Description);
          })
          .Pageable(p => p.PageSizes(true)
                     .ButtonCount(5))
          .Sortable()
          .Scrollable()
          .HtmlAttributes(new { style = "height: 450px;" })
          .DataSource(dataSource => dataSource.Ajax()
                                   .ServerOperation(false)))

The remove is done using the below javascript code

function removeSelected() {
      var grid = $('#AssignedGrid').data('kendoGrid');
      var dataSource = grid.dataSource;
      var rows = grid.select();
      var data = rows.map(function () {
         return grid.dataItem($(this));
      });
      for (var i = 0; i < data.length; i++) {
         dataSource.remove(data[i]);
      }
      grid.clearSelection();
   }

On the remove function I had also had a code to go to the first page ( dataSource.page(1) ) but if I remove all the data going to page 1 would display the initial data. Now without the code to go to the first page it works by going to page 0 and displaying no items.

However I still have a problem when I change the number of records on a page I get again to the first page and the initial data. Is there a way to really remove the data, so regardless what actions I do (), not to get the initial data?

 

Dan
Top achievements
Rank 1
Iron
Iron
Veteran
 answered on 15 Jun 2018
5 answers
225 views

I need just one simple thing.  I need to change the color from the barely visible half transparent close icon on grouping headers to actually be visible.  I have tried setting a multitude of classes to try and get this damn thing to show up.  I've actually ended up screwing up my entire grid just trying to find this one simple thing.  When oh when will you people make overriding these damn classes and styles easy.  ARGH!!!

Sorry about that, just a bit frustrated.  So what do I need to do to get this damn icon to show up?

Stefan
Telerik team
 answered on 15 Jun 2018
2 answers
211 views
I am trying to make use of the custom downloader on the website to create a custom javascript file for a simple grid. So I included it in the page and deleted all the kendo scripts I don't need anymore. Then I noticed in the network tab that kendo is trying to load jquery, jszip, kendo.all, kendo.aspnetmc, and kendo.modernizr.custom. There is nothing I can see that explicitly tries to load these files. How do I stop kendo from trying to load these files?
Tomasz
Top achievements
Rank 1
 answered on 14 Jun 2018
1 answer
400 views

I'm creating this new thread because I only found 6 threads at this date (6/12/2018).  Here is the link of the search results: https://www.telerik.com/search?start=0&q=filter%2blogical%2boperators&collection=telerik30&ResourceType=Forum&hgurl=aspnet%252Dmvc&fid=e78f666bc2724221a02481d46f4c0cb5 

My question is about where to find in the documentation of Telerik Grid for MVC the comparison and logical operators that can be used to programmatically filter the Grid columns.  Say I want to filter that column 1 has value 1 or value 2, and column 2 has a date greater than value 3.

You answer will be appreciated.  I already know a solution code to my question.  What I'm looking for is how to find the information about the API.  Or how do I search the Kendo documentation site so I can get the answer.

Preslav
Telerik team
 answered on 14 Jun 2018
Narrow your results
Selected tags
Tags
Grid
General Discussions
Scheduler
DropDownList
Chart
Editor
TreeView
DatePicker
Upload
ComboBox
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
ListView (Mobile)
Pager
Accessibility
ColorPicker
DateRangePicker
Wizard
Security
Styling
Chat
MediaPlayer
TileLayout
DateInput
Drawer
SplitView
Barcode
ButtonGroup (Mobile)
Drawer (Mobile)
ImageEditor
RadioGroup
Sparkline
Stepper
TabStrip (Mobile)
GridLayout
Template
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
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Sergii
Top achievements
Rank 1
Iron
Iron
Dedalus
Top achievements
Rank 1
Iron
Iron
Lan
Top achievements
Rank 1
Iron
Doug
Top achievements
Rank 1
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?