I have a Kendo MVC Grid that uses Inline editing. When I click "Add New Record" it is supposed to default the entry to DateTime.Now. The issue is that this value doesn't update, it continues to show the time the page was loaded instead of the time when the row is added.
I have tried to set it in the editor template and the model and I am getting the same result. My guess is I would have to set the javascript but cant find how to do this with inline fields and select the right DateTimePicker to update the value on. How can I have this default value be set when the add new record button is clicked.
When you set the DefaultValue in the DataSource Model definition the DateTime.Now value will get serialized as part of the initialization script.
If you need this to by dynamic you can add an Edit event handler and check if the model instance edited is a newly created one. If so set the date field to the current date and time:
function onEdit(e){
if(e.model.isNew()){
e.model.set("MyDateField",new Date());
}
}
Here is an example.
Related
(MVC Razor) So on my page I have a Kendo grid which contains a DropDownList within a certain column. Now I don't want to fill data of my dropdownlist from controller (With Viewbag/ViewData) before the page loads because it would slow it down, but instead I'd like to fill the DropDownList data on user click with a call to a controller function, and call the read method only once(on first click). How would I be able to achieve this goal?
Set autoBind property to false. It will cause that dropdown will not be filled by data before user click on it.
After component is initialized dataBound event is started so you can set readonly in it.
Demo here
When you create a jqgrid there is a default button on the bottom of the grid that allows you to create new records.
However, when you open the modal, all input fields are empty.
In my situation I need this button, but I also need the exact same thing but with the possibilty of adding a few parameters so some of the fields are already filled in. The parameters would come from the selected row at that moment.
Like when I click a row where the date is set to 01/01/2099 i need the add-modal to open with the date already set to that date.
You can use beforeShowForm or afterShowForm to make any changes in the Add Form during opening. For example you can read the values from currently selected row and fill some fields of the form with new values. To be open Add form on click or double-click on the row you need just call editGridRow inside of onSelectRow/ondblClickRow callback.
I'm using Telerik Kendo UI Professional. I have a grid with an edit template, and several controls on it. I ran into a weird little requirement, where I needed to programmatically set the value of one of the controls, based on another control being changed. The actual change of value seems to happen just fine. However, when I submit the form to save changes, the new, programmatically-set value is ignored; it sends the original value instead. If the user changes the value himself, the new value is submitted just fine.
Here is a sample:
http://dojo.telerik.com/#wittca/otoxO
This is not my original code, but it shows the same problem. In this version, upon opening the edit popup, I programmatically modify the value of the UnitsInStock KendoNumericTextBox. Then when I save the form, I would expect to see the new value, but I still see the old value in the grid. So it does not take the programmatically-generated new value.
My original code is trying to set the value of a KendoComboBox, when one of the other controls changes, and the same situation happens. I didn't have time to create the exact same situation, but most likely if we can fix that dojo sample, the same fix would apply to my ComboBox.
Here is the response I got from Telerik support:
You will need to trigger the change event as well, as the Grid listens for it in order to update the value. Please see the updated example here:
http://dojo.telerik.com/UjUkE
var units = e.container.find("[name='UnitsInStock']").data("kendoNumericTextBox");
units.value( <insert new value here> );
units.trigger("change");
The key line of code is that last one; that manually triggers the "change" event on the control, which forces the Grid to update the value.
This fix also works with my original problem involving ComboBoxes.
He is a solution for you:
If you change the edit function that you have from:
edit: function (e) {
var units = e.container.find("[name='UnitsInStock']").data("kendoNumericTextBox");
var unitsValue = units.value();
units.value(unitsValue+1);
}
to this:
edit: function (e) {
var val = e.model.UnitsInStock;
e.model.set("UnitsInStock", val+ 1);
}
It will bind the updated value for you.
Here is my updated code for you to test:
http://dojo.telerik.com/OHaKA/2
I'm facing a problem that I can't understand. I'm using Kendo Grid with InCell edit and I have a DateTime field in my Model.
When the grid enters in edit mode, the calendar is shown, but the grid only saves the inputed value if I select the value from the calendar. If I input the field manually, the value is not saved and the cell is not marked has dirty.
If it helps, I'm using MVC with Razor sintax.
Tks in advance!
I've found a workaround in Kendo's forums:
By design, the DatePicker does not raise the change event when the value is set programmatically - it raises only if the date is modified by the end-user. In case you need to trigger the change event, you can use jQuery trigger().
For example:
var datePicker = $("#datepicker").data("kendoDatePicker");
datePicker.value("01/01/2001");
datePicker.trigger("change");
Reference:
http://www.kendoui.com/forums/ui/date-time-pickers/datepicker-change-event.aspx
So basically what I did was to force the change event manually.
I have an MVC 3 Razor Telerik grid. I have an Edit comand on the row.
When a user clicks on Edit (this places the grid in Edit mode with an Update and Cancel button), I want to set a property for two of the columns to readonly.
When the user clicks on Cancel or Update, I want to set the columns back to full permission.
I know there must be some properties in the controller I should be able to set when the Edit button is pressed for this, but have not seen any docs on how to accomplish this.
How can I do this?
I'm using version 2011.2.712.340 of the controls.
What your describing above sounds a little bit confusing. The purpose of the readonly property is to ensure that when your row enters edit mode the columns that had readonly explicitly set cannot be edited, which seems to be what you're looking for. When in regular read mode all columns will have the same permission whether or not readonly was set, since you are just viewing the data and not editing.
Edit after clarification from comment:
Seems like you want to have this field editable when you are inserting a record, but not when you edit the row. Well, this can be done using some JavaScript. If you use Ajax binding (the only way to fire this event) you can do the following by subscribing to the onEdit client-side event:
...
.ClientEvents(clientEvents => clientEvents.OnEdit("onEdit"))
...
And here's the JavaScript:
<script type="text/javascript">
function onEdit(e) {
var form = e.form;
var mode = e.mode;
if (mode == "edit") {
var country = form.Country; //Country is a public property of my Model
country.disabled = true;
}
}
As you can see above, I get the form with the associated edited row and specifically grab the field associated with the property I do not want to be edited and disable that input element.