how to get focus on previous selected row with page in jqgrid? - jqgrid

I am try to get focus on jqgrid previous selected row with page but I could't do it.so please give a solution for that.

You have to save the id of selected row for example in localStorage of web browsers. Try the demo or another one which uses multiselect: true option. The demos do what you asked. Both demos are from the answer which is modification of another answer which I posed before and where I discuss advantages of usage localStorage instead of cookie.

Related

Is there a way to tell user the multi-sort order in jqgrid?

I am using jqgrid(4.5.4) and implemented multi-sorting in it using code below.
multiSort: true
The client also wants to see what column they sorted first and so on. Do we have a way to display it in jqgrid? If this feature doesn't exist, we request this in future release. Thanks
My suggestion is
To show the list of column-name, sort-icon and a close button next to it in the form of tags similar to stack overflow tags(this would be great).Just plain list is also fine. It can be displayed on top/below the grid. It should keep updating each time the sort is performed. We can remove sort on particular column by deleting the tag or clicking on column header(default behavior). The multi-sort order should still be preserved.

jqGrid special Sorting

I have this data presented in a view with a jqGrid table.
It has a complex sorting order of rows done server side.
Now I need to be able to do some "free" sorting of the rows at the View.
By free I mean that the client needs to be able to move a row up or down to any place they want, skipping all the other sorting rules done at server.
Of course, this will need to be saved to the database later.
I thought that maybe add a column with an Up and Down arrow, that when clicked it will move the row to where it needs to be.
I'm not at my best with JavaScript, and I can't seem to find any examples of something similar to this anywhere.
Any tips on how could I approach do this?
Or is there a better option?
Thanks.
There is the Sortable Rows feature built into the jqGrid.
You set it up with the following API call:
jQuery("#yourgridid").jqGrid('sortableRows', options);
It uses the jquery-ui Sortable widget for this so the optional options parameter can be used for any of the available options for the widget which you can find here.
For Example:
jQuery("#yourgridid").jqGrid('sortableRows', { cursor: 'crosshair' });
You can see a sample of this on the Demo page. (New in Version 3.6 -> Sortable Rows)

Is there any way to keep current page when sorting jqgrid columns?

My jqgrid contains several pages. When I sort any column the page resets to first.
(That's right also for filterToolbar i.e. after calling $("#my-grid")[0].triggerToolbar();)
Is there any way to keep my current page after sorting/filtering ?
EDIT:
Actually my problem is a little more complicated.
I save jqgrid preferences(rowNum, page, filters etc..) to the cookie.
When I load the page first time I load the prefs.
I use the technique from Mark B's answer (see jqGrid Filter Toolbar initial default value) to populate my filter default values.
The problem: in that case page always sets to the first.(because of triggerToolbar calling) i.e. it doesn't save state.
I don't quite understand your requirement. If the user has seen some rows on the second page for example and then the user has clicked on the column header to sort the column the the grid will be sorted. The data which the user have seen before can be on any page. So I don't understand why you want hold the current page which will show absolutely another data as it showed before.
If you do need to hold the page you can do this in the following way. Inside of the loadComplete you can save the value of page parameter. Inside of onSortCol event handler the value will be already changed to 1, but you can correct it to the value which you saved before. I didn't tested this, but I think it should work.
UPDATED: Now I think I understand your original problem. I think you should choose another way described here or here. What you needs is just to save in the cookie the postData value and to set search:true parameter of jqGrid if the filters is not empty (or other filter parameter depend on the options which you use). In the way you should be able to restore not only the filter, but additionally the page value. The final solution can a little depend from jqGrid parameters and the parameters of filterToolbar which you use. So it you will have implementation problem you should include more code which you use.
I'm using mvc with jqgrid and this solition work for me:
$("#GridTable").jqGrid({
...
onSortCol:
function () {
var postpage = jQuery("#GridTable").getGridParam('postData');
jQuery("#GridTable").setGridParam({ page: postpage.page });
},
...
});

jqGrid form edit stuck with initially loaded values

When I open form to edit values:
It doesn't change form values when I navigate with <> buttons
It opens New form with same values as first edited row, and when I click "Submit", it overwrites that row instead of creating a new item
When I click to edit another row, it always shows the form values for the first edited row – i.e. if I click New first and then edit row, it shows empty form.
So, in short, the first time form opens, the values are "stuck" whatever row I open later.
What can cause this? I remember it used to work OK some time ago.
UPDATE:
No with recreateForm I don't have this issue (I use it as temporary workaround).
Hm, I can reproduce this on jqGrid example, but not on Live Manipulation - on New in Version 3.7, Add/edit/delete on local data:
Click any row and edit it (open form)
Close form
Select any other row and click edit - form shows incorrect values (from the row that was opened first)
Click Add new row button in toolbar - form shows same values - which is very convenient, usually new rows are "almost" same - if only it would add new row, not update the existing one!
Of course in live demo Submit doesn't do that (it doesn't seem to work at all) but except for this symptoms are same.
Also <> buttons do not change data in form, though they change selected row - but from what I remember previously it used to update form values also to match selected row.
Probably you should post the description of your bug with "New in Version 3.7", "Add/edit/delete" as a bug in the in trirand forum.
The problem is that the bug exist in very special environment/data/settings. For example I tested my old local edit example modified to jqGrid 3.8.1 or in 3.7.2 and can not reproduce the problem which you describes. So you can use my examples as a template could it helps you.
Moreover in all examples which I use for real projects I use always parameter recreateForm:true. If you don't use it jqGrid not create a form, but try to use an existing with other data. It works in a lot of cases wrong. For example if you use any dataInit functions they will be called only once during creating of the form, which can make very strange affects. If you use edittype: 'custom' the usage of recreateForm:true is really mandatory (see this). So I recommended many times all people to use
jQuery.extend(jQuery.jgrid.edit, {recreateForm: true});
to set recreateForm: true as your default settings. You could save many hours or days of debugging of some strange effects in your edit/add dialogs.

How do I edit a jqgrid from javascript

I have a jqgrid that has several columns including a checkbox column that indicates if an item is selected.
Underneath that I have a dropdown menu and a text box. The idea is that each item in the dropdown menu is a column in the jqgrid. Then all I need to do is modified all of the checked rows with the contents of the text box for that column. So a quick mass update mechanism if you will.
The problem is, is that I can't figure out how to update a specific cell. Any tips or documentation that can help me? Thanks!
You can use for example setRowData (see jqGrid documentation) or setCell to update the data in the grid. The functions getCol, getCell or getRowData could help you the examine the row data. Another old answers: this and this could be helpful if you decide to search data in the grid with respect of jQuery.
Here's the "answer" I came up with to my problem. I wanted to edit only rows that were editable. Using setCell would overwrite my editable field with a non-editable one. So I looked at the HTML for a given row while it is in the edit state and passed that into the 'setCell' method. It feels 'hackish' though and if someone knows a better way, I'm all ears.

Resources