Dealing with IDs with blank spaces (Cytoscape.js)

Question

I'm implementing a prerequisite graph using Cytoscape.js. But the problem is, when I set the id with the course name, (for example: Beginning Programming), I can't properly select the node because of the blank space in the course name.

temp.group = "nodes";
temp.data = {id: a, label: b}; // A: "Beginning Programming" B: "1111"
cy.add(temp);

Then, when I do this:

cy.$("Beginning Programming");

It says it is an invalid selector.

Is there a way of doing so?

score 1 · Accepted Answer · answered Jul 05 '15 at 00:11

1

After few hours of researching, I found that attribute selector works. The following code works like a charm.

cy.$("[id='Beginning Programming']");

answered Jul 05 '15 at 00:11

Moved

130
8

score 0 · Answer 2 · edited May 23 '17 at 11:43

0

You cannot use spaces in the id (see Can a DOM element have an ID that contains a space?).

I'd recommend replacing the space with underscore like this

var modifiedId = a.split(' ').join('_');
temp.data = {id: modifiedId , label: b}; // A: "Beginning_Programming" B: "1111"

If the id is also displayed, you could replace it with %20 (which is displayed as a space in html)

edited May 23 '17 at 11:43

Community

1
1

answered Jul 04 '15 at 18:57

Ed Ballot

3,405
1
17
24

Replacing the space with underscore is another solution, but I use the id as the label too. It means I need another attribute to put the course name. – Moved Jul 05 '15 at 00:11

Dealing with IDs with blank spaces (Cytoscape.js)

2 Answers2