UI-grid - define type by cell - angular-ui-grid

I have a editable UI-grid in my page. The first column is a dropdownlist with many options. Depending on the item that the user selects in this first column, the second column must accept only number or hexadecimal.
It's possible to define type from a specific cell? Does anybody have a example?
Thanks.

try this:
type
the type of the column, used in sorting. If not provided then the grid will guess the type. Add this only if the grid guessing is not to your satisfaction. One of:
'string',
'boolean',
'number',
'date',
'object',
'numberStr'
Note that if you choose date, your dates should be in a javascript date type
from http://ui-grid.info/docs/#/api/ui.grid.class:GridOptions.columnDef
$scope.gridOptions = {
columnDefs: [ { field: 'col1', name: 'First Column', type: 'number'} ],
data: data
}

Related

category axis on kendo chart not rendering correctly

I have a Kendo Chart bound to a data model which is receiving a list of different points. The category axis is a date axis in which the maximum and minimum value are bound to the model. Always the span for the category axis is one whole year (12 months, not necessarily beginning from January).
The code for the axis is as follows:
.CategoryAxis(axis => axis
.Labels(labels => labels.Rotation(0).Format("MMM ‘yy"))
.Date().Min(Model.StartDate).Max(Model.EndDate).Justify(false)
)
The category axis renders correctly when I have more than 1 data point present in the chart, however when I have just one datapoint the category axis becomes a mess (all the labels become stacked and repeated).
i was wondering if there is a way to specify a mandatory number of ticks to the axis as to always have just 12 ticks corresponding to each month.
Thanks
Luis.
The only to have all the ticks is to append your data of chart with null values of missing months. So when you have got one data point you need to append other data point with null values but remaining other months. Please see below sample code:
<div id="kk"></div>
<script>
var _data=[{"weight":200,"createddate":"1/1/2014"},
{"weight":200,"createddate":"2/1/2014"},
{"weight":200,"createddate":"3/1/2014"},
{"weight":149.91,"createddate":"4/1/2014"},
{"weight":null,"createddate":"5/1/2014"},
{"weight":null,"createddate":"6/1/2014"},
{"weight":null,"createddate":"7/1/2014"},
{"weight":null,"createddate":"8/1/2014"},
{"weight":null,"createddate":"9/1/2014"},
{"weight":null,"createddate":"10/1/2014"},
{"weight":null,"createddate":"11/1/2014"},
{"weight":null,"createddate":"12/1/2014"}]
$("#kk").kendoChart({
dataSource: {
data:_data
},
seriesColors: ["Red"],
seriesDefaults: {
type: "column",
},
series: [{
name: "weight",
field: "weight",
categoryField: "createddate",
}],
categoryAxis: {
type: "date",
baseUnit: "months"
}
});
</script>
Please find a JSFiddle for the same.
This way when you get your JSON Data from Controller, either you can update the JSON Data at Controller Side and Append Missing Data Points with null value or else you can do it in javascript as well once you get the data in the View and before binding it with chart.

Is it possible to use null datapoints with a datetime x-axis?

I'm trying to use the type:'datetime' for my x-axis, and am getting a graph on a vertical line and dates going all the way back to 1970. Is there any way to circumvent this error?
Here's my use case: I'm tracking my page performance at regular intervals. if the server goes down for any reason or the metric was unable to be tracked, then we end up with a gap in the line. the requirement is to show this as datetime, but if i populate the series with any null datapoints, Highcharts throws an error 15.
series: [{
data: [
{x:1389254400000,y:10},
{x:1389554400000,y:9},
null,
{x:1389854400000,y:12}]
}]
Here's the fiddle: http://jsfiddle.net/agjZB/23/
If i remove the null datapoint, everything works fine. Thanks for the extra eyes!
You have to make the NULL point the same format as your other points.
Or, don't include it. If you have no data for timestamp x why include it or if you have no data at all why include it?
Example of option 1:
series: [{
data: [
{x:1389254400000,y:10},
{x:1389554400000,y:9},
{x:1389554400000,y:null},
{x:1389854400000,y:12}]
}]
For line chart you shouldn't use points with the same x value, becasue a few feateaures like tooltip will not work correct. You need to set scatter type and lineWidth as 2.

Kendo UI-single column,multi column search

I did a some Google about kendoui column search and feel no exact answer for me so i am posting it here. Please help or guide me where i can find my requirement.
I am going to integrate Kendoui Grid to load huge amount of data from my database, with that I wants to have single as well multi column search functionality in the grid.
My requirement us when a user key in their search value then the grid should filter the value using single column as well multi column search like the below image
I wants to implement the same search in kendo ui.
I know kendoui has filter functionality but, I exactly wants the functionality like the below.
Thanks in advance
You can use the filter method of the grid's data source to perform filtering. Something like this:
grid.dataSource.filter( {
// display items that meet any of the conditions
logic: "or",
// filter conditions
filters: [
{ field: "CompanyName", operator: "contains", value: "searchstring" },
{ field: "Country", operator: "contains", value: "searchstring" }
]
});

Variable in valueSuffix?

Is it possible reference a point from a series within the valueSuffix parameter?
I want to include a percentage value within the Suffix by dividing the height of the series 1 column by the height of the series 2 column.
So something like the following:
valueSuffix: ( series[1].max / series[2].max ) + ' %'
Is this possible?
Thanks in advance!
Armin
The API states this : valueSuffix: String
Which means the valueSuffix can only be a String. If you want something more complex than a string, consider using tooltip.formatter instead
Inside the formatter you will have access to the chart as this.series.chart and from the chart you can then access any series or any point you may wish to

Kendo grid sorting in desc order

I am using Kendo grid in my Grails app and my requirement is to sort "date" column in descending order as soon as the row get inserted, so that most recent date comes at the top row in the grid.
How do I sort by the date column?
Default sort criteria is a property on your dataSource:
sort: { field: "date", dir: "desc"}

Resources