I have a simple grid that uses a custom popup editor template. In the template, I'd like to use a Numeric Textbox.
Due to localization, the application keeps trying to use a comma to separate decimals in the numeric values. When these values are passed to the ASP.NET MVC back-end, the value is lost and null is passed. How can I ensure the posted value has a period separator?
I have tried setting the underlying field values to 2.5 instead of 2,5 in the grid's Save event, as well as tried to overwrite the e.model.WeightKg to 2.5. The value is still passed with a comma separator, as shown by inspecting the form data in the request.
My grid:
#(Html.Kendo().Grid<PackageViewModel>()
.Name("PackageGrid")
.Columns(columns => {
columns.Bound(o => o.PackageCode);
columns.Bound(o => o.WeightKg);
columns.Command(o => o.Edit());
})
.DataSource(d => d
.WebApi()
.Model(m => m.Id(o => o.PackageCode))
.Read(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Packages" })))
.Create(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Packages" })))
.Destroy(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Packages" id = "{0}" })))
.Update(c => c.Url(Url.HttpRouteUrl("DefaultApi", new { controller = "Packages" id = "{0}" })))
.PageSize(20)
)
.Editable(e => e.Mode(GridEditMode.PopUp).TemplateName("Package"))
.Selectable()
.Deferred()
)
The numeric textbox in the template:
#Html.Kendo().NumericTextBoxFor(m => m.WeightKg).Decimals(8)
And finally, the unparsed form data, followed by the parsed form data:
sort=&group=&filter=&PackageCode=DOOS-B&WeightKg=2%2C5
sort:
group:
filter:
PackageCode:DOOS-B
WeightKg:2,5
Related
I have a MVC Kendo grid where one column is a client template that actually uses multiple fields. By default the built in filtering is only applied to the field the column is bound to. How do I override that so it considers both fields. Ie, when I search for "Contains" "De" a column that displays "Detroit, MI" should return.
Here's what I have so far:
MVC View
#(Html.Kendo().Grid<ViewModel>()
.DataSource(dataSource => dataSource
.Custom()
.Transport(t =>
{
t.Read(r => r.Action("StatusGridRead", "DeviceStatus"));
})
.Schema(schema => schema
.Data("Result.Data")
.Total("Result.Total")
.Errors("Result.Errors")
.Model(m =>
{
m.Id(f => f.Id);
m.Field(f => f.StateOrProvince);
m.Field(f => f.City);
...
})
)
)
.Columns(columns =>
{
columns.Bound(c => c.StateOrProvince).Title("City & State").ClientTemplate("#=City#, #=StateOrProvince#");
...
})
.Events(e=>
{
e.Filter("statusGridFilter");
})
.Sortable()
.Filterable(f =>
{
f.Extra(false);
f.Operators(o => o.ForString(s =>
{
s.Clear();
s.Contains("Contains");
s.IsEqualTo("Is Equal To");
s.StartsWith("Starts With");
s.EndsWith("Ends With");
s.DoesNotContain("Does Not Contain");
s.IsNotEqualTo("Is Not Equal To");
}));
})
)
Javascript
function statusGridFilter(e) {
if (e.field == "StateOrProvince") {
//What do I do here?
}
}
I understand if I made a column for city and one for state that would resolve this issue, however I actually have a similar scenario (client template with many string fields displayed) where that won't work and am just picking this as the easiest example. Other than making 1 column for 1 field, I'm open to any other ideas that may solve filtering for this scenario.
I have a Model who has a column (attribute) that stored a comma separated value of IDs.
For Example,
Movie has a column "Genre" that includes more than one genre, e.g.: 40,20,1,3
How can I use Select2 widget to show these values separated when 'multiple' => true
And how can I save them back into comma-separated value as a string. I want a solution that will allow for quick flexibility. I know you can implode and explode the string but seems too much.
Any help appreciated
If I remember correctly pass the default option as part of the $options configuration for the widget:
echo $form->field($model, 'model_attribute_name')->widget(Select2::className(), [
'data' => $data
'options' => [
'class' => 'form-control',
'placeholder' => 'Choose Option...',
'selected' => 40
],
'pluginOptions' => [
'allowClear' => true,
],
])->label('Select2 Form Field');
This is from memory for grain fo salt here. The documentation at http://demos.krajee.com/widget-details/select2 is not very specific about how to do this.
I don't believe you can do that. Select2 sends the data in post as an array, so you would still need to use implode before saving. What i would do instead is in your model class:
class MyModel extends \yii\db\ActiveRecord {
$public myArrayAttribute;
...
public function beforeSave($insert) {
if (parent::beforeSave($insert)) {
$this->myAttribute = implode(',', $this->myArrayAttribute);
return true;
}
return false;
}
public function afterFind() {
parent::afterFind();
$this->myArrayAttribute = explode(',', $this->myAttribute);
}
}
This way myArrayAttribute will hold the values from the comma separated field as an array. Of course you will need to add validation rules for it and use it instead of your other attribute in create and update forms.
if you're displaying a form with already populated fields, maybe you want to update an already existing object, and you want to display the already saved value for the Select2 field, use 'data' => [ 1 => 'Some value' ], where 1 is the value, associated to the value displayed in the form. You can retrieve stuff to put in data from DB beforehand.
Source: https://github.com/kartik-v/yii2-widget-select2/issues/37
the \kartik\grid\EditableColumn widget has a parameter called ajaxSettings where you may override the parameters passed with the ajax request to the server. What i want to do is to dynamically pass the selected rows ids together with the value coming from the popover to the server. I manage to do that passing static parameter coming from a php array in compile time like so
Editable::widget(['name' => 'publishDate', 'ajaxSettings' => ['ids' => [1,2,3]]])
but It seems that i cannot use a jquery selector there to grab the ids of the selected columns like so
Editable::widget([
'name' => 'publishDate',
'ajaxSettings' => [
'ids' => '$("#books-grid").yiiGridView("getSelectedRows")'
]
])
Maybe you want to try creating a variable outside the Editable::widget([ like this:
var arrayIds = $("#books-grid").yiiGridView("getSelectedRows");
And then assign it to the widget:
Editable::widget([
'name' => 'publishDate',
'ajaxSettings' => [
'ids' => arrayIds
]
])
Hope this helps,
Leo.
I am new to Kendo and are trying to add a custom command to a grid.
I have been going over example pages, StackOverflow, and Telerik's site and found multiple examples that has the following:
columns.Command(command =>
{
command.Custom("Details").Text("Show Details").Action("Details", "Billing");
});
When I try to use this, I get the following error:
'GridCustomActionCommandBuilder' does not contain a
definition for 'Action' and the best extension method overload
'UrlHelperExtensions.Action(IUrlHelper, string, object)' requires a
receiver of type 'IUrlHelper'
I then tried this example from telerik:
columns.Template(#<text>#Html.ActionLink("Edit", "Home", new { id = item.ProductID })</text>);
But get this error:
Cannot convert lambda expression to type 'string' because it is not a
delegate type
Just to confirm what is causing the error, then took out the ActionLink and used only this:
columns.Template(#<text>
<div>help me!!</div>
</text>);
and got the same error:
The total code snippet looks like this:
#(Html.Kendo().Grid<OrganisationEmployeesViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(p => p.EmployeeID).Visible(false);
columns.Template(#<text>
<div>help me!!</div>
</text>);
})
.Pageable()
.Sortable()
.Scrollable()
.Filterable()
.HtmlAttributes(new { style = "height:550px;" })
.DataSource(dataSource => dataSource
.Ajax()
.PageSize(20)
.Read(read => read.Action("Employees_Read", "Organisations"))
)
.Deferred()
)
I am using existing samples but don't know what is wrong.
I found a way for this to work:
columns.Template("<a href='" +
Url.Action("ControllerAction", "Controller") +
"?Parameter=#= RecID #'" +
">DisplayText</a>");
This can also be applied to a bound column like this:
columns.Bound(p => p.Name).ClientTemplate("<a href = '" +
Url.Action("Details", "Employees") +
"/#= EmployeeID #'" +
">#=Name#</a>");
And should you want to have a Custom Toolbar Action on the Kendo Grid:
I am using the standard bootstrap classes to apply defaults:
.ToolBar(t => t.ClientTemplate("<a class='k-button k-button-icontext k-grid-add' href='" +
Url.Action("OrganisationCreate", "Employees", new { OrganisationId = Model.OrganisationID }) +
"'><span class='k-icon k-add'></span>Add new Employee</a>") )
Code below works great with aspx view engine, i am trying to convert it to razor as below. Problem is first column do not show up.
I convert first column into link using action method. With razor it(first column) is not getting rendered in page at all. Rest of grid is fine.
What could be the problem?
#{Html.Grid(Model.Orders).Attributes(style => "width: 100%;").Columns(
column => {
column.For(x => x.OrderNumber).Action(p => {
#:<td>
Html.ActionLink(
p.OrderNumber.ToString(),
"orderdetail",
"OrderUpdate",
new { id = p.OrderNumber, backUrl = Url.Action("OrderHistory", new { controller = "DataController", id = ViewData["id"] }) },
new { });
#:</td>
}).HeaderAttributes(style => "text-align:left");
column.For(x => x.OrderTimeV2).HeaderAttributes(style => "text-align:left");
column.For(x => x.Status).HeaderAttributes(style => "text-align:left");
column.For(x => x.Type).HeaderAttributes(style => "text-align:left");
}).RowStart((p, row) => { }).Render();}
I have moved away from using mvccontrib grid as it doesn't make much sense in grid we have.
Anyway problem was code in the question does not return html but puts code directly into response stream. And code for columns rendered using razor which put's code into stream whenever called. so it ends up putting columns into stream before grid is rendered.
It was resolved by not using razor code in action called by grid.
Ok I got it working for me with the following
#Html.Grid(Model.Result).Columns(column => {
column.For(u => u.Name).Named("Name");
column.For(u => u.Code).Named("Code");
column.For(u => Html.ActionLink("Edit", "Edit", new { id = u.Id })).Named("Edit");
You can do a custom column to get what you want:
#Html.Grid(Model).Columns(column => {
column.Custom(
#<div>
<em>Hello there</em>
<strong>#item.Name</strong>
</div>
).Named("Custom Column");
})
From: MvcContrib Grid Custom Columns (Razor)
I did this when porting some .aspx pages to Razor.