additonal parameters for custom_func? - jqgrid

I want to reuse the following code for custom_func:
function validLen(value,colName){
if(value.length === 8){
return [true,""];
}
else{
return [false,"fail"];
}
}
I tried giving it an additional parameter as follows:
function validLen(value,colName,length){
if(value.length === length){
return [true,""];
}
else{
return [false,"fail"];
}
}
And calling it like this:
{name:'cntrct_id', editrules:{custom: true, custom_func:validLen(8)} },
Didn't work. The previous code DOES work, but as stated, I want a reusable function. Is there a workaround for this? Am I doing it wrong?

I would recommend you to use
editoptions: { maxlength: 8}
instead of the custom validation which you use. In the case the input element will be created with the maxlength attribute directly. So the user will not able to type more as characters as specified by maxlength.
UPDATED: You can't change the interface of any callback function, but you can do share common code of different custom_func in the following way. You define your custom validation function having three parameters like
function validLen (value, colName, valueLength) {
if (value.length === valueLength) {
return [true, ""];
}
else {
return [false, "fail"];
}
}
and use it in the following way
{
name: 'cntrct_id',
editrules: {
custom: true,
custom_func: function (value, colName) {
return validLen(value, colName, 8);
}
}
If you need to use this inside of custom_func then you can change return validLen(value, colName, 8); to return validLen.call(this, value, colName, 8);.

Related

jqGrid Unformatter for predefined formatter

I have a jqGrid where the formatter function for the colModel must be defined as a string
{name:'FileSize', index:'FileSize', width:90, editable: true,
formatter: 'fileSizeFormatter'}
I can't use the following where the formatter function is not a string because I build the colmodels on the server side in C#. If I could use the non string formatter Defining unformatter would be a solution as shown in
Here
{name:'FileSize', index:'FileSize', width:90, editable: true,
formatter: fileSizeFormatter}
And here is the fileSizeFormatter I needed to use fn.fmatter because my formatter is passed as a string and the code assumes it is one of the predefined one's lile "select", "currency"...etc
$.fn.fmatter.fileSizeFormatter = function (cellval, options) {
var fileUnit = "B";
if (cellval) {
var fileUnit;
var iKBFileSize;
if (cellval < 1024) {
iKBFileSize = cellval;
} else {
iKBFileSize = cellval / 1024;
fileUnit = "KB";
}
var result = iKBFileSize.toFixed(1) + fileUnit;
return result;
}
return cellval + fileUnit;
};
Sample
So the question is how can I define unformatter for a formatter which is passed as a string. When I do grid.getrowdata or edit the cell my unformatter is not being used. It is getting me the data with the file unit.
$.unformat.fileSizeFormatter = function (cellvalue, options, cell) {
return $('input', cellval).is(":checked") ? true : false;
};
You should define unformatter in a little another way:
$.fn.fmatter.fileSizeFormatter.unformat = function (cellValue, options, elem) {
return $(elem).find('input').is(":checked") ? true : false;
}
You should define unformatter of cause after defining the formatter ($.fn.fmatter.fileSizeFormatter).

How to know which attribute called the waterline validation rule?

I'm doing my own custom validations on certain fields, so that only certain values are accepted (depending on the field) and the rest rejected. I would like to write a "filter" function that checks what attribute called the validation and from there decide what words the attribute is allowed to use. So the model would look something like this:
module.exports = {
types: {
filter: function(attribute) {
if (attribute === 'number') {
switch(attribute.value) {
case 'one':
return true;
case 'two':
return true;
default:
return false;
}
} else if (attribute === 'color') {
switch(attribute.value) {
case 'red':
return true;
case 'blue':
return true;
default:
return false;
}
}
},
},
attributes: {
number: {
type: 'string',
required: true,
filter: true
},
color: {
type: 'string',
required: true,
filter: true
}
}
};
Of course, in normal Sails.js behaviour, "attribute" would not be the attribute, but the value of the attribute. (And attribute.value was just an example, meaning, I want the attribute value in there).
So, I want attribute to be the actual attribute that called the validation rule. Is this possible with Sails? I mean, I could write a function for each field in the model, but it would be nice to have a function that fits them all (I have many of them).
Thanks.
Ok so I will answer your question, but this may not be exactly what you want. An attribute can have an "enum" which is how we'd achieve your end goal:
attributes: {
state: {
type: 'string',
enum: ['pending', 'approved', 'denied']
}
}
But I will assume that this code is just a contrived example. Here's a way that I think would work.
module.exports = {
types: {
filter: function(attribute) {
if (attribute === 'number') {
switch(attribute.value) {
case 'one':
return true;
case 'two':
return true;
default:
this.validationErrors.push(attribute);
return false;
}
} else if (attribute === 'color') {
switch(attribute.value) {
case 'red':
return true;
case 'blue':
return true;
default:
this.validationErrors.push(attribute);
return false;
}
}
},
},
attributes: {
validationErrors:(function(){
var errors = [];
return {
push:function(attr){
errors.push(attr);
},
get:function(){
return errors;
}
};
})(),
number: {
type: 'string',
required: true,
filter: true
},
color: {
type: 'string',
required: true,
filter: true
}
}
};
Edit:Used an attribute method instead of an attribute
There are potentially a couple problems with this answer. I'm not sure how waterline handles "this" within these custom type functions. Is "this" bound to the model? Or the instance of the model we're creating? There's a lot of questions to be asked here but maybe this can give you some ideas and create a discussion.

jqgrid formatter not working and no response

i have a js file and the function name called viewLineBtn.
in my server code, i have created a list of object
List<GridModelClass> addmodelResult = new List<GridModelClass>();
addmodelResult.Add(new GridModelClass { name = "AddTestApprove", label = "Approve", width = "40", hidden = false, formatter = "viewLineBtn" });
however, the viewLineBtn can not be recognize. How to solve it?
It seems that you returns colModel as JSON data return from the server. As the result you have formatter property which have the type string (like formatter: "viewLineBtn") instead of function (like formatter: viewLineBtn, where viewLineBtn defined before as a function).
To fix the problem you can change how you defined formatter function. Instead of the usage
function viewLineBtn (cellValue, options, rowObject) {
// do something here
return htmlFragmentOfCell;
}
you should use
$.extend($.fn.fmatter, {
viewLineBtn: function (cellValue, options, rowObject) {
// do something here
return htmlFragmentUsedInCell;
}
});
In the case you can use formatter: "viewLineBtn" in colModel.
I would recommend you to define always custom unformatter (unformat property) if you defines custom formatter. To do this in case of usage string value of formatter you should define unformatter in the following way:
$.extend($.fn.fmatter, {
viewLineBtn: function (cellValue, options, rowObject) {
// do something here
return htmlFragmentUsedInCell;
}
});
$.extend($.fn.fmatter.viewLineBtn, {
unformat: function (cellValue, options, elem) {
// do something here
return htmlFragmentFromDomElem;
}
});

Rally sorting by Parent

What I Need
I would like to sort my grid/store by the Parent field, but because the Parent field that is fetched is an object, it fails to fetch any records when I put a sorter based on the Parent property. Even if I add a sorter function, it is not called. I am using a rallygrid, not sure if that makes a difference
sorters: [{
property: 'Parent',
direction: 'DESC',
sorterFn: function(one, two) {
console.log('one',one);
console.log('two',two); // console never shows these
return -1;
}
}]
What I have tried
To get around displaying the object, I have added a renderer function to the Parent column. I tried adding a doSort to the column, and that function is called, but sorting the store does not call my sorterFn, it only uses the property and direction (similar to the console.log() that fails to run above)
Here is an example of a custom App that works properly. The key is setting the default storeConfig of remoteSort to false!
Ext.define('CustomApp', {
extend: 'Rally.app.App',
componentCls: 'app',
launch: function() {
App = this;
Rally.data.ModelFactory.getModel({
type: 'PortfolioItem/Feature',
success: function(model) {
App.add({
xtype: 'rallygrid',
id : 'grid',
model: model,
columnCfgs: [
'FormattedID',
'Name',
{dataIndex: 'Parent', name: 'Parent',
doSort: function(state) {
var ds = this.up('grid').getStore();
var field = this.getSortParam();
console.log('field',field);
ds.sort({
property: field,
direction: state,
sorterFn: function(v1, v2){
v1 = v1.get(field);
v2 = v2.get(field);
console.log('v1',v1);
console.log('v2',v2);
if (!v1 && !v2) {
return 0;
} else if (!v2) {
return 1;
} else if (!v1) {
return -1;
}
return v1.Name.localeCompare(v2.Name);
}
});
},
renderer: function(value, meta, record) {
var ret = record.raw.Parent;
if (ret) {
return ret.Name;
} else {
return record.data.Name;
}
}
}
],
storeConfig: {
remoteSort: false
}
});
}
});
}
});

How To use Custom Control in jqGrid

how to use custom control in Jqgrid for Field. example in add/edit popup I have a date field and i Want use persionDatePiker, How do these settings?
Thanks all,
Yoou need to set edittype to custom and provide custom_element and custom_value functions. Example from documentation:
<script>
function myelem (value, options) {
var el = document.createElement("input");
el.type="text";
el.value = value;
return el;
}
function myvalue(elem, operation, value) {
if(operation === 'get') {
return $(elem).find("input").val();
} else if(operation === 'set') {
$('input',elem).val(value);
}
}
jQuery("#grid_id").jqGrid({
colModel: [
{
name:'price',
editable:true,
edittype:'custom',
editoptions:{
custom_element: myelem,
custom_value:myvalue
}
},
//...
]
});
</script>
But in order to integrate e.g. jQuery UI Datepicker I used the following code:
{
name:'startTime',
label: 'Start time',
editable: true,
editoptions: {
dataInit: function (e) {
$(e).datetimepicker({});
}
}
}
See Common Editing Properties for details.

Resources