Develop Reference

Is there a way to get all the data from the grid that is sorted and edited in jqgrid?

I have a grid that can be paging, sorted, and edited.
I have to save data after I get all the data in the grid.
For example, if you sorted and edited a grid, you must be able to import the edited and sorted data, that is, the data displayed on the screen.
I used this method.
$('#grid).jqGrid('getRowData')
It can get edited grid data, but it only takes one page of data.
so I used this method.
$('#grid).jqGrid('getGridParam', 'data)
It can get all grid data, but it's not apply sorting.
I tried this answer.
answer
It can get sorting data, but it's not apply inline edit.
I want to get all the grid data.
Is there any way?

I found the answer. It's very simple. :(
Just add {key: true} in colModel.

jqGrid onCellSelect Return Property from Local Data

I've run into an issue using jqGrid 5.2.1.
I'd like to retrieve a property from a row of data when a user clicks on a cell. The property is in the original data set, but it isn't displayed in the grid. Also, I'm using the scroll feature, so the row ID's are coming back like "jqg20".
I've tried using getRowData, but that only returns the data that is displayed in that row. getLocalRow will not accept the row ID with "jqg" in it. Is there another way that I can access the same row in the local data that the user clicked in the grid to pull out a property? The property 'attr' is what I want to pull out in the example:
var testData = [
{col1:10, col2:20, col3:30, col4:'TEST', col5:50, col6:60, col7:70, col8:80, col9:90, col10:100, attr: {property: "this is column 1"}}
]
Here is the jsfiddle that I've created to show the problem:
https://jsfiddle.net/rhv247q7/

Before to answer of the direct problems I need to do some notes.
It is recommend to use the jqGrid version where the problem persist. You tell us for version 5.2.1, but you use 4.6, which we think can come to some uncomfortable situations.
It is always good idea to set id row – this can be done either in the description of the colModel (key : true) or with the appropriate reader in this case localReader. When you set this you will be sure that there will be not a problems getting certain row and some other important commands. It is not good idea to let the grid create the ids.
Now to the problem : to do what you want you should use the getLocalRow, which return the data as it comes to the grid – i.e the original data.
In your case there was a bug when scroll is on and no id is set from the developer (i.e. the grid creates internally the id). The problem is fixed in GitHub and you can test it.

Can I Create a Single HighCharts Graph from Multiple Data Sources (Multiple GoogleSheets in this case)

I’m trying to use data from multiple GoogleSheets to produce a single HighChart graph.
I’d like to do this without moving all the data into one area of a single spreadsheet, particularly as I want to use the drilldown option which would make it difficult to collect all the data together.
I thought I could pass the columns as an array and then reference the array in the data property of my chart, but I’m struggling to do that with even one column from one sheet.
I have searched for answers online, but I have not found anything relating to highcharts getting data from multiple sources.
Previous Research:
Using GoogleSheets Data as an array before creating the chart: (Removed Link) - The problem is that I could only use one GoogleSheets reference here as the chart object sits inside the data object.
API documentation - (Removed Link) – tells me I can access the columns but that’s not the part I’m having problems with
Querying the Chart: (Removed Link) - I have actually considered making hidden charts, then interrogating the data and making new charts from those, but that seems like a very long way round and I’m still not sure I could grab all the data I need.
Using two GoogleSheets for separate charts on the same page: (Removed Link) I have done this.
Please could you help me to understand how I can access the properties and methods of this object outside of the object itself?
Thank you.
My Code:
//Function to produce a data array ***Not Working - Cannot extract array from object method***
function getData(){
Highcharts.data({
googleSpreadsheetKey: '12x66_QEkTKg_UzvpHEygdTmfnu7oH81pSQYn78Hxt80',
googleSpreadsheetWorksheet: 4,
startColumn: 16,
endColumn: 22,
startRow: 63,
endRow: 76,
parsed: function (columns) {
var dataTest2 = [];
var columnLength = columns[1].length;
for (i = 0; i < columnLength; i = i + 1) {
dataTest2.push(columns[1][i]);
}
alert(dataTest2); //This works here, but not if I move it outside of the method, even if I return it.
var testReturn = this.googleSpreadsheetKey; //trying to return any property using "this" - I've also tried this.googleSpreadsheetKey.value but still undefined
return testReturn; //returns "Undefined"
}
});
}

You could use Google Sheets webQuery. Basically, this is a method to export the Spreadsheet's data into a given format such as csv, json, etc. In your case, the link should look like this:
https://docs.google.com/spreadsheet/tq?key=12x66_QEkTKg_UzvpHEygdTmfnu7oH81pSQYn78Hxt80&gid=4&tq=select%20A,%20B&tqx=reqId:1;out:csv;%20responseHandler:webQuery
Please note that here "tg?key" is the key of your Google Sheet, and "&gid=" is NOT 4, this only tells Highcharts to selected Sheet 4, but for Google Sheets look at the source link and copy the numbers which go after "&gid=". Furthermore, "&tq=" is used to select the columns of the Google Sheet, which in the link above selects "Column A" and "Column B". To find out more on how to select columns and query the output refer to:
https://developers.google.com/chart/interactive/docs/querylanguage?csw=1#Setting_the_Query_in_the_Data_Source_URL
Lastly, "&tqx=" is used to output your data in the format you want. The above link uses "out:csv" which will output the data as comma-separated values. This could as well be Json if you like. Have a look at this documentation:
https://developers.google.com/chart/interactive/docs/dev/implementing_data_source#requestformat
In order to implement this output into your javascript code which you would then use to built your chart, you could use external Javascript libraries to handle these outputs. If you output your data as CSV, you can use "papaparse.js" to parse the CSV into Json which you can be then read by highcharts and allows you to built the chart. Refer to this documentation:
http://papaparse.com/docs#remote-files
An alternative to this would be, to output your Google Sheets directly as Json, then use jquery to make an Ajax Call and load the JSON-encoded data into your Javascript code. Precisely, you could perhaps use jQuery.getJSON() to get the data. Look at this link for more details on how to get Json:
http://api.jquery.com/jquery.getjson/
Finally, it is up to you on which format you choose to output the data, I prefer using Json as it saves you the extra step of having to convert the CSV into Json. Whatever suits you best and is easier for you to understand.
Once you have your data, you may have to parse your Json objects with Json.parse(), and then organize your data into an array with .push(). As #jlbriggs stated, organize your data first before you built the chart. Afterwards, you can make two, three or more Ajax calls to import data from different sources. I would not use many as this will impact in your loading and slow down data transfer.
NB: It is important to format the data accordingly for Highcharts to recognize the data, so use parseFloat() to convert strings into numbers, Date.UTC() to convert strings into date, etc.
Hope this helps you.

SharePoint2013 - Javascript - Pagination in client side- Using listitemcollectionposition

I am getting data from a sharepoint list based on certain filter criteria.
I am getting the records using javascript object model. This is working fine.
I am facing issue with pagination.
I have referred this article :
http://social.technet.microsoft.com/wiki/contents/articles/18606.sharepoint-2013-paging-with-sharepoint-client-object-model.aspx
This works for "Next Page".
Doesnt work for "Previous Page" in my case, because the values are retrieved randomly. So,the IDs are not consecutive.
Does "listItemCollectionPosition" work only for data which is consecutive?
previousPagingInfo = "PagedPrev=TRUE&Paged=TRUE&p_ID=" + myListItems.itemAt(0).get_item('ID');
This code doesnt work properly, some records are getting missed out.

The listItemCollectionPosition works for custom filtered and sorted list data.
In the link you share, there is another linked article that has an example for sorting and pagination.
https://code.msdn.microsoft.com/sharepoint/SharePoint-JSOM-list-5104ca92
You need to add additional values to your previousPagingInfo string to specified how you are sorting the result. In the example below I assume you are sorting your results by a list column with name "SORTCOLUMNNAME".
previousPagingInfo = "PagedPrev=TRUE&Paged=TRUE&p_ID=" + myListItems.itemAt(0).get_item('ID') + "&p_SORTCOLUMNNAME=" + myListItems.itemAt(0).getitem("SORTCOLUMNNAME");

You can find a good example here, how to page in CSOM:
https://code.msdn.microsoft.com/office/SharePoint-JSOM-list-5104ca92
There are some articles that gives you the following answers about paging in Sharepoint 2013.
A very important consideration to take into account:
- with JSOM or the classic webservices svc/asmx or oData, you cannot use the "$skip" particle to do paging of listitems. So it is OOTB almost impossible to do a true paging with numbers.
For items, you have to use listItemCollectionPosition in your SOAP or using $skiptoken (oData).
The only paging possible is previous/next.

JSON encoded formatter function name

I'm using jqgrid for which I create column definitions on server as dynamic objects and serialize them using Json.Encode:
html.Raw(System.Web.Helpers.Json.Encode(ColumnDefinition);
I have problem with applying custom formatter, as my serialized column definition is:
{"name":"Icon","index":"Icon","hidden":false,"formatter":"iconFormatter","unformat":{}}
Problem is in quotes which are added to all keys and values to respect JSON specification, and those around iconFormatter are problem in my case as I want that to be my function.
Is there a simple solution for this?

It seems to me that you have the same or close problem as described here. You will have to replace the string values of the formatter properties to the function reference. Pragmatic way is to search for the strings like "iconFormatter" (search for all custom formatters which you use) and replace there to the corresponding function refernce.
UPDATED: If you would be use template property inside of column definition (see here) you would be solve the problem in another way. Additionally you code will be shorter, more clear and better readable.