We Keep Coding

add ascending or descending to url in React

I am trying to create a url based on the data I get from the user.if we consider this to be my url:
let url = new URL('http://localhost:8080/api/movies/search/search');
I add the search fields like this:
for (let item in data) {
url.searchParams.set(item,data[item]);
}
but at the end of my url I want to add the sort type for it to look something like this:
const url = `http://localhost:8080/api/movies/search/search?title=something&minRate=10&genre=action&sort=title,asc`;
so how should I add the last part with the comma:
,asc
to the url?

Based on comments on the question above...
If data is this:
{
title: 'the',
minRate: 2,
genre: 'action',
sortType: 'title',
type: 'asc'
}
And the result you want is this:
http://localhost:8080/api/movies/search/search?title=the&minRate=2&genre=action&sort=title,asc
Then data doesn't match what you're looking for. It has two properties called sortType and type, and you want one combined property called sort.
Project the object into the shape you want, then use that new object to build your params:
let data = {
title: 'the',
minRate: 2,
genre: 'action',
sortType: 'title',
type: 'asc'
};
let url = new URL('http://localhost:8080/api/movies/search/search');
// create the object you want:
let urlData = {
title: data.title,
minRate: data.minRate,
genre: data.genre,
sort: `${data.sortType},${data.type}`
};
// then add params from *that* object:
for (let item in urlData) {
url.searchParams.set(item, urlData[item]);
}
console.log(url);
(Note that the , character is URL-encoded by default.)
Basically, don't change the logic to work around the data structure. Keep the logic simple and change the data structure to what you need it to be.

ExtJS creating record from existing store

I have created an ext store like so:
var store = new Ext.data.JsonStore({
root: 'vars',
fields: [{ name: 'rec_id', mapping: 'rec' }, { name: 'identity', mapping: 'id'}]
});
This works alright when I add data to the store via loadData(); and some json which looks like:
{ vars : {rec: '1', id:'John'} }
My problem is that if I use add(); to get this record into the store I have to first create it as an Ext.data.Record object.
I do this as pointed out here: https://stackoverflow.com/a/7828701/1749630 and it works ok.
The issue I have is that the records are entered with their mapped parameters rather than the ones I set. I.e, 'rec_id' becomes 'rec' and 'identity' becomes 'id'.
What am I doing wrong here?

You need to do the mapping manually, something like this:
var myNewRecord = new store.recordType({
rec_id: vars.rec,
identity: vars.id
});
store.add(myNewRecord);

Dojo - error trying remove and add item to store (assertion failed in ItemFileWriteStore)

I have store (and grid which displays its content), users could remove and add item but unfortunately one item after deleting could not be again added. I figure out problem is same id which was previously in store.
I use Dojo 1.6.
In firebug console I got:
Error: assertion failed in ItemFileWriteStore
Here is demo on jsFiddle: http://jsfiddle.net/MBBnE/
and here code:
dojo.require("dojo.data.ItemFileWriteStore");
dojo.addOnLoad(function() {
var d = {
items: [
{
id: 23,
x: 2},
],
identifier: "id",
};
var _store = new dojo.data.ItemFileWriteStore({
data: d,
});
var it = null;
_store.fetch({
query: {
id: "23*"
},
onItem: function(i) {
it = i;
}
})
_store.deleteItem(it);
console.info(it);
_store.newItem({id: 23, x: 3});
});

Hopefully I didn't misunderstand your question, but when you remove an item from a store if you want to re-add another item with the same id, you should save the store then re-add the item. Saving the store will clear all dirty items and allow the id to be reuse.

When you insert same value in Itemfilewritestore it will give you error 'assertion failed in ItemFileWriteStore'
To overcome this problem insert new or unique value in ItemFileWriteStore
_store.newItem({id: 24, x: 3});
I hope this will help you.

Finally I did a little workaround - create new store and copy all items to it:
oldStore.fetch({
onItem: function(it){
var newItem = {
id: it.id[0],
valueX: it.valueX[0],
(...)
};
newStore.newItem(newItem);
}
});

Why does this datagrid sort in a weird order?

I have a datagrid where each row has a column where I have defined a formatter to format the display result depending on what it says in the database and create a div with a background color depending on the database.
I have this structure for my datagrid:
structure: [
{
name: "Name",
field: "name",
width: "auto"
},
{
name: "Initials",
field: "initials"
},
{
name: "E-mail",
field: "email",
width: "auto"
},
{
name: "Kerberos",
field: "kerberos",
width: "120px",
formatter: function(kerberos){
var format = "";
if(kerberos == "password expired" || kerberos == "account expired"){
format = '<div class="yellow" title="'+kerberos+'">'+kerberos+'</div>';
}else if(kerberos == "ok"){
format = '<div class="green" title="'+kerberos+'">'+kerberos+'</div>';
}else{
format = '<div class="red" title="Has no kerberos account">not available</div>';
}
return format;
}
},
When I press the column header to sort, it sorts the rows, put not consistent, so I don't know if it sorts correctly (see image below). How do I define the way the datagrid have to sort this column?
I was thinking it was the HTML <div...> part I do in the formatter due to the <> characters, but it still sorts weird if I only output the text (which by my understanding, should be sorted alphabetically). Does anyone know why this happens and how I can fix it?
EDIT:
forgot to add how i get/assign data. I get a lot of data from a xhr.post in JSON format, then i do as follows:
dojo.xhr.post({
url: "/cgi-bin/users.cgi",
handleAs: "json",
content: {
psearch: "dojoXhrBlank"
},
load: function(jsondata){
// Creating a store for the datagrid
var personStore = new Memory({ data: jsondata });
// Create datastore for datagrid
var gridStore = ObjectStore({objectStore: personStore});
...

I found an answer. The problem lies in ObjectStore. This store (for some reason) wont sort properly and after changing the store type to ItemFileReadStore it sortet properly. The other reason for switching store was that ItemFileReadStore also supports the comparatorMap attribute which allows for custom sorting, ObjectStore dose not support this attribute.
solution:
load: function(jsondata){
var store = new ItemFileReadStore({
data: { identifier: "id", items: jsondata }
});
pgrid = new DataGrid({
store: store,
...

Array (json) not passing into jqGrid's editoptions parameters

I've been trying to pass an array from a global variable (codata) to an option array of editoptions (jqGrid). My code stands as follows:
--------- countries_list.php throws the following json array -----------
["ABU","AD","AE","AF" .... "ZA","ZM","ZW"]
--------- PHP script with jqGrid Code ----------
jQuery(document).ready(function(){
var codata = new Array();
$.getJSON('countries_list.php', function(list){
$.each(list, function(val) {
codata.push("'"+val+"'");
# --- Here alert() displays 'codata' with all the elements ---
});
});
$("#datatable").jqGrid({
......
// some code until colMode specs
......
{ name:'guco',
index:'guco',
edittype:'select',
width:90,
editable: true,
editoptions: {
formatter:'select',
value: codata # --- array is not passed, it comes empty ---
},
sortable: true,
resizable: false
},
.....
--------- PHP script with jqGrid Code ----------
Any hint how to get this fixed?, thanx in advance.
Mario Benitez.-

Thanx a lot to all you guys, I learnt a lot with your contributions. Problem was fixed as follows:
(reading about) I found that getjson works an 'async mode' (I'm a jQuery newbie) and the code to fix the problem was:
jQuery(document).ready(function(){
var codata = (function () {
var list = null;
$.ajax({
'async': false,
'global': false,
'url': 'countries_list.php',
'dataType': 'json',
'success': function (data) {
list = data;
}
});
return list;
})();
$("#datatable").jqGrid({
... jqGrid settings ...
colModel: [
....
{ name:'guco',
index:'guco',
edittype:'select',
width:90,
editable: true,
editoptions: {
value: codata
},
sortable: true,
resizable: false
},
....
Thanx a lot once again, I hope this helps to someone else.
Mario Benitez.

From what i see your php script is passing valid js array, not json object. The most logic thing to do is to call jqGrid inside the ajax callback assigning $("#datatable").jqGrid({ ... editoptions: { value: list } ... });

I would recommend you to use dataUrl together with buildSelect instead of value of the editoptions. You can find the corresponding code example of buildSelect in the "UPDATED" part of the answer.

I tried both ways and the Answer given in Olegs links helped. Using the buildSelect param allows full control of the value. When I used value method it assigned simple integer values of 0 - n. You can also assign your own CSS classes in this paradigm too. +1 for buildSelect/dataurl.