jqGrid - Make column name label different from its corresponding field name - jqgrid

I.e. I want the field name "Firstname" to have an asterisk in it to denote a compulsory e.g. "*Firstname", but I don't want the main grid column name to have asterisk in it too.
Clicking the Edit button pops up a form with the asterisk it in, but this also appears on the Grid when viewing the resultset.
Can someone advise on a way around this?
Thanks.
This is what I've currently got that doesn't solve my problem.
colNames: ['*Firstname']
colModel:[{ name: 'Firstname', index: 'Firstname', label: 'Firstname', width: 150, editable: true, editrules: { required: true} }]

If you set some prefix or suffix for the column name in the Edit form you should use corresponding formoptions instead of the colNames or label property in the colModel.

Related

js-grid adding a insert template causes field to disappear

I have a 7 field grid set up in jsgrid. For one of the fields I need to create an insert template to control entry. Unfortunately, as soon as I add the code, the field no longer appears on the form. None of the fields before and after are affected.
Even if I just create the template like this:
insertTemplate: function() {
return;
}
The field disappears.
Here are the field parameters entered just before the insertTemplate:
{ title: "Kab Cost",
name: "kab_cost",
type: "text",
align: "right",
editing: true,
readOnly: false,
css: "grid_small",
validate: "required",
width: 5,
I get no javascript errors in the console. If I remove the insert template, the field appears.
I have other fields that are using insert templates with no issue.
Any ideas?
Arrghh,
To display the field, the insertTemplate needs a return of the contents (even if blank) I had all of the returns within if statements that could not resolve on initialization of the grid.
Moved the return outside of the if statement and everything went back to normal.
Slapping forehead with hand.

kendo grid column filtering when bind to the Id field

Please find the DOJO: DOJO
I have a custom dropdown editor for user field. Editors and templates everything is working fine. But when I want to filter the User column using the names, it is not working. It is because I am binding the userId in the field option. So kendo grid is searching for only UserId field, not UserName in the data source.
Whenever I save the grid only the UserId field will get saved to the database. So I should bind the UserId field to the column.
My requirement is to search using the Name in the User Column, not the UserId.
Please let me know what will be the approach.
In the code for your grid you need to change field from UserId to UserName like below:
$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
height: 550,
filterable: true,
columns: [
{field: "UserName", title: "User", width: "180px", editor: userDropDownEditor, template: userTemplate},
{field:"role"}
],
editable: true
});
The filter will then look at UserName instead of the id. Here's is the updated dojo.

how to save the width of jqgrid columns permanently at the time of re-sizing (re-size )?

i want to save the width of coumns of jqgrid, when user re-size the column the width should be saved, so next time when user open the page the width should be the same user did. is it possible?
js code
{ name: 'FirstName', index: 'FirstName', width:100, align: "left", sorttype: 'text', resizable: true, editable: true, editrules: { required: true } },
i have tried shrinkToFit:false, autowidth:false
any idea, any suggestion will be appreciated...i will mark it as answer if it works for me
thank. if you need any extra information about the code i am here to explain..just comment ;)
jqGrid don't provide any API to change the column width after the grid been created, but I created the plugin which do this. You can download jQuery.jqGrid.setColWidth.js from here, included it after jqGrid JavaScript files and then you can just use new setColWidth method in the form
$("#grid").jqGrid("setColWidth", colNameIrIndex, newWidth);
The method setColWidth will adjust the total grid width after changing the width of the column. If you don't need it you ca add false as an additional last parameter of setColWidth:
$("#grid").jqGrid("setColWidth", colNameIrIndex, newWidth, false);
Additional details about the method you will find in the answer and in this one.
Probably you can write your code so that the width of columns will be set before the grid will be created. In the case you will don't nee the method setColWidth. For example you can try the demo from the answer (see the previous answer too). If you changes the width of some column and then reload the full page you will see that the grid will be created using the widths of column which the used made at the last time. Is it not close to your requirements?

Jquery-Jqgrid in MVC

I have a Jqgrid, and I am trying to show some fields on the grid, but when I Form Editing it, and show all Fields, which is having more columns than showing on the Grid.
For Example: I have a Document table, which have ID, Name,Size, Description, Date
on the Grid I only show ID, Name, and Size
when user click on the Edit, which is Form Editing, then let the users Edit all the Columns.
How can I do it?
well first you gotta put some code here, from what i can understand here, you have a grid with lets say 5 columns and when you want to go with form editing then you want to edit and show only 3 columns, right? so what you need to do, put editable:false with your colModal
for example
{ name: 'Id', index: 'Id', align: 'right', editable: false, hidden: true}
this will hide the Id column in grid and if you try to go for form editing Id will not be editable and it will not be there in edit form dialogue..

JqGrid filter toolbar not refreshing on reload of grid

OK, I am having an issue with the filter toolbar retaining the filter values after clicking on the Refresh button at the bottom of the grid.
I have looked at numerous examples that do exactly that, clear the top filter toolbar fields to the default state (in the case of select list, to the first item in the list "Select..."), but I do not see any obvious difference between that code and mine
Values are being loaded into the filter toolbar drop down boxes via JSON request, and on selecting an item in the list the grid filters to the appropriate data.
The only thing that is not working is that the filter drop-down(s) do not clear the selected item upon clicking refresh grid.
Any ideas?
Not sure what code would help to post at this point, so I will post upon request
Justin
Well, I have answered my own question :)
The issue turned out to be related to naming convention for column names and indexes.
Example:
Before fix:
{ name: ClientId', index: 'ClientOrganization.Client.ClientId', width: '125', stype: 'select', searchoptions: { sopt: ['eq'], dataUrl: '#Url.Action("GetClientListForFilter")'} },
After fix:
{ name: 'ClientOrganization.Client.ClientId', index: 'ClientOrganization.Client.ClientId', width: '125', stype: 'select', searchoptions: { sopt: ['eq'], dataUrl: '#Url.Action("GetClientListForFilter")'} },
Basically the name needed to be the same as the index to properly refresh. Not sure if this is expected behavior or not, but the fix works. ;)
Justin

Resources