Display field based on another in JointJS
I have an inspector which contains a list of object has name and type, and my custom data. Let say i wanna display my custom data base on the choice of type attribute. I can do this with 'when' but it's only if it is the simple field with specific path like "attr/type". Since it's in the list, the index vary so i dont know how to specify the path to check whether what type is chosen. Any idea for this problem ?
data: {
type : 'list',
item: {
type: 'object',
properties: {
'name' : {
type : 'text',
group : 'text',
label : 'Name',
index : 1
},
type : {
type : 'select',
group : 'text',
label : 'Type',
options: ['Text','Number','Date','Select','Text Area'],
index : 2
},
required : {
type : 'toggle',
group : 'validation',
label : 'Required',
index : 3
},
'min-length' : {
type : 'number',
group : 'validation',
min : 0,
label : 'Min Length',
index : 4
},
'max-length' : {
type : 'number',
group : 'validation',
min : 1,
label : 'Max Length',
index : 5
},
'min' : {
type : 'number',
group : 'validation',
min : 0,
label : 'Min',
index : 6
},
'max' : {
type : 'number',
group : 'validation',
min : 1,
label : 'Max',
index : 7
},
'message' : {
type : 'text',
group : 'validation',
label : 'Error message',
index : 8
},
'regex' : {
type : 'text',
group : 'validation',
label : 'Regex',
index : 9
},
'options' : {
type : 'list',
item : {
type:'object',
properties: {
'text' : {
type : 'text',
label : 'Text',
index : 1
},
'value' :{
type : 'text',
label : 'Value',
index : 2
}
}
},
group : 'validation',
label : 'Options',
index : 10
}
}
},
group : 'validation',
label : 'Input',
index : 1
}
jointjs rappid
asked Jun 10 '16 at 7:46
K9_HCM Phng Vn BuK9_HCM Phng Vn Bu
314
add a comment |
I have an inspector which contains a list of object has name and type, and my custom data. Let say i wanna display my custom data base on the choice of type attribute. I can do this with 'when' but it's only if it is the simple field with specific path like "attr/type". Since it's in the list, the index vary so i dont know how to specify the path to check whether what type is chosen. Any idea for this problem ?
data: {
type : 'list',
item: {
type: 'object',
properties: {
'name' : {
type : 'text',
group : 'text',
label : 'Name',
index : 1
},
type : {
type : 'select',
group : 'text',
label : 'Type',
options: ['Text','Number','Date','Select','Text Area'],
index : 2
},
required : {
type : 'toggle',
group : 'validation',
label : 'Required',
index : 3
},
'min-length' : {
type : 'number',
group : 'validation',
min : 0,
label : 'Min Length',
index : 4
},
'max-length' : {
type : 'number',
group : 'validation',
min : 1,
label : 'Max Length',
index : 5
},
'min' : {
type : 'number',
group : 'validation',
min : 0,
label : 'Min',
index : 6
},
'max' : {
type : 'number',
group : 'validation',
min : 1,
label : 'Max',
index : 7
},
'message' : {
type : 'text',
group : 'validation',
label : 'Error message',
index : 8
},
'regex' : {
type : 'text',
group : 'validation',
label : 'Regex',
index : 9
},
'options' : {
type : 'list',
item : {
type:'object',
properties: {
'text' : {
type : 'text',
label : 'Text',
index : 1
},
'value' :{
type : 'text',
label : 'Value',
index : 2
}
}
},
group : 'validation',
label : 'Options',
index : 10
}
}
},
group : 'validation',
label : 'Input',
index : 1
}
jointjs rappid
asked Jun 10 '16 at 7:46
K9_HCM Phng Vn BuK9_HCM Phng Vn Bu
314
add a comment |
I have an inspector which contains a list of object has name and type, and my custom data. Let say i wanna display my custom data base on the choice of type attribute. I can do this with 'when' but it's only if it is the simple field with specific path like "attr/type". Since it's in the list, the index vary so i dont know how to specify the path to check whether what type is chosen. Any idea for this problem ?
data: {
type : 'list',
item: {
type: 'object',
properties: {
'name' : {
type : 'text',
group : 'text',
label : 'Name',
index : 1
},
type : {
type : 'select',
group : 'text',
label : 'Type',
options: ['Text','Number','Date','Select','Text Area'],
index : 2
},
required : {
type : 'toggle',
group : 'validation',
label : 'Required',
index : 3
},
'min-length' : {
type : 'number',
group : 'validation',
min : 0,
label : 'Min Length',
index : 4
},
'max-length' : {
type : 'number',
group : 'validation',
min : 1,
label : 'Max Length',
index : 5
},
'min' : {
type : 'number',
group : 'validation',
min : 0,
label : 'Min',
index : 6
},
'max' : {
type : 'number',
group : 'validation',
min : 1,
label : 'Max',
index : 7
},
'message' : {
type : 'text',
group : 'validation',
label : 'Error message',
index : 8
},
'regex' : {
type : 'text',
group : 'validation',
label : 'Regex',
index : 9
},
'options' : {
type : 'list',
item : {
type:'object',
properties: {
'text' : {
type : 'text',
label : 'Text',
index : 1
},
'value' :{
type : 'text',
label : 'Value',
index : 2
}
}
},
group : 'validation',
label : 'Options',
index : 10
}
}
},
group : 'validation',
label : 'Input',
index : 1
}
jointjs rappid
asked Jun 10 '16 at 7:46
K9_HCM Phng Vn BuK9_HCM Phng Vn Bu
314
I have an inspector which contains a list of object has name and type, and my custom data. Let say i wanna display my custom data base on the choice of type attribute. I can do this with 'when' but it's only if it is the simple field with specific path like "attr/type". Since it's in the list, the index vary so i dont know how to specify the path to check whether what type is chosen. Any idea for this problem ?
data: {
type : 'list',
item: {
type: 'object',
properties: {
'name' : {
type : 'text',
group : 'text',
label : 'Name',
index : 1
},
type : {
type : 'select',
group : 'text',
label : 'Type',
options: ['Text','Number','Date','Select','Text Area'],
index : 2
},
required : {
type : 'toggle',
group : 'validation',
label : 'Required',
index : 3
},
'min-length' : {
type : 'number',
group : 'validation',
min : 0,
label : 'Min Length',
index : 4
},
'max-length' : {
type : 'number',
group : 'validation',
min : 1,
label : 'Max Length',
index : 5
},
'min' : {
type : 'number',
group : 'validation',
min : 0,
label : 'Min',
index : 6
},
'max' : {
type : 'number',
group : 'validation',
min : 1,
label : 'Max',
index : 7
},
'message' : {
type : 'text',
group : 'validation',
label : 'Error message',
index : 8
},
'regex' : {
type : 'text',
group : 'validation',
label : 'Regex',
index : 9
},
'options' : {
type : 'list',
item : {
type:'object',
properties: {
'text' : {
type : 'text',
label : 'Text',
index : 1
},
'value' :{
type : 'text',
label : 'Value',
index : 2
}
}
},
group : 'validation',
label : 'Options',
index : 10
}
}
},
group : 'validation',
label : 'Input',
index : 1
}
jointjs rappid
jointjs rappid
asked Jun 10 '16 at 7:46
K9_HCM Phng Vn BuK9_HCM Phng Vn Bu
314
asked Jun 10 '16 at 7:46
K9_HCM Phng Vn BuK9_HCM Phng Vn Bu
314
edited Jun 15 '16 at 9:09
K9_HCM Phng Vn Bu
asked Jun 10 '16 at 7:46
K9_HCM Phng Vn BuK9_HCM Phng Vn Bu
314
asked Jun 10 '16 at 7:46
K9_HCM Phng Vn BuK9_HCM Phng Vn Bu
314
asked Jun 10 '16 at 7:46
K9_HCM Phng Vn BuK9_HCM Phng Vn Bu
314
314
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
I affraid you need to create a field for each type from the name/type collection. Similar problem is solved here:
operator: {
type: 'select',
options: ['over', 'in', 'out', 'atop', 'xor', 'arithmetic'],
},
k1: {
type: 'number',
when: { eq: { operator: 'or' } }
},
k2: {
type: 'number',
when: { eq: { operator: 'arithmetic' } }
},
k3: {
type: 'number',
when: { eq: { operator: 'xor' } }
},
k4: {
type: 'number',
when: { eq: { operator: 'over' } }
}
EDIT:
it's obvious this approach cannot be used in your case... xpath
when: { eq: { 'labels/0/type': 'Number' } } is valid but useless. It's not doable easilly so far, we set up a new issue for this. Would be nice to have something like when: { eq: { '*/type': 'Number' } } where * could be current context, so you would be able to get current index.
answered Jun 14 '16 at 15:21
ladeslades
612
Could u be more detail ? I edited my post to provide more information. As u can see, i want to set my 'regex' field appear only when my 'type' is 'Date' or 'Number'. Thank you
– K9_HCM Phng Vn Bu
Jun 15 '16 at 9:11
any suggest solution sir ?
– K9_HCM Phng Vn Bu
Jun 23 '16 at 6:50
add a comment |
You have to provide inside the Attribute of particular element..
For example you need to hide the message element based on attr/type option You need to write the code like that..
'message' : {
type : 'text',
group : 'validation',
label : 'Error message',
when: { ne: { 'data/item/type': "Your Option here!!"} },
index : 8
},
Suggestions are welcome!! Thank you
answered Nov 14 '18 at 9:05
KarthikKarthik
2910
Why are you down voting.. is there any suggestion means comment
– Karthik
Nov 14 '18 at 10:22
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f37742721%2fdisplay-field-based-on-another-in-jointjs%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
I affraid you need to create a field for each type from the name/type collection. Similar problem is solved here:
operator: {
type: 'select',
options: ['over', 'in', 'out', 'atop', 'xor', 'arithmetic'],
},
k1: {
type: 'number',
when: { eq: { operator: 'or' } }
},
k2: {
type: 'number',
when: { eq: { operator: 'arithmetic' } }
},
k3: {
type: 'number',
when: { eq: { operator: 'xor' } }
},
k4: {
type: 'number',
when: { eq: { operator: 'over' } }
}
EDIT:
it's obvious this approach cannot be used in your case... xpath
when: { eq: { 'labels/0/type': 'Number' } } is valid but useless. It's not doable easilly so far, we set up a new issue for this. Would be nice to have something like when: { eq: { '*/type': 'Number' } } where * could be current context, so you would be able to get current index.
answered Jun 14 '16 at 15:21
ladeslades
612
Could u be more detail ? I edited my post to provide more information. As u can see, i want to set my 'regex' field appear only when my 'type' is 'Date' or 'Number'. Thank you
– K9_HCM Phng Vn Bu
Jun 15 '16 at 9:11
any suggest solution sir ?
– K9_HCM Phng Vn Bu
Jun 23 '16 at 6:50
add a comment |
I affraid you need to create a field for each type from the name/type collection. Similar problem is solved here:
operator: {
type: 'select',
options: ['over', 'in', 'out', 'atop', 'xor', 'arithmetic'],
},
k1: {
type: 'number',
when: { eq: { operator: 'or' } }
},
k2: {
type: 'number',
when: { eq: { operator: 'arithmetic' } }
},
k3: {
type: 'number',
when: { eq: { operator: 'xor' } }
},
k4: {
type: 'number',
when: { eq: { operator: 'over' } }
}
EDIT:
it's obvious this approach cannot be used in your case... xpath
when: { eq: { 'labels/0/type': 'Number' } } is valid but useless. It's not doable easilly so far, we set up a new issue for this. Would be nice to have something like when: { eq: { '*/type': 'Number' } } where * could be current context, so you would be able to get current index.
answered Jun 14 '16 at 15:21
ladeslades
612
Could u be more detail ? I edited my post to provide more information. As u can see, i want to set my 'regex' field appear only when my 'type' is 'Date' or 'Number'. Thank you
– K9_HCM Phng Vn Bu
Jun 15 '16 at 9:11
any suggest solution sir ?
– K9_HCM Phng Vn Bu
Jun 23 '16 at 6:50
add a comment |
I affraid you need to create a field for each type from the name/type collection. Similar problem is solved here:
operator: {
type: 'select',
options: ['over', 'in', 'out', 'atop', 'xor', 'arithmetic'],
},
k1: {
type: 'number',
when: { eq: { operator: 'or' } }
},
k2: {
type: 'number',
when: { eq: { operator: 'arithmetic' } }
},
k3: {
type: 'number',
when: { eq: { operator: 'xor' } }
},
k4: {
type: 'number',
when: { eq: { operator: 'over' } }
}
EDIT:
it's obvious this approach cannot be used in your case... xpath
when: { eq: { 'labels/0/type': 'Number' } } is valid but useless. It's not doable easilly so far, we set up a new issue for this. Would be nice to have something like when: { eq: { '*/type': 'Number' } } where * could be current context, so you would be able to get current index.
answered Jun 14 '16 at 15:21
ladeslades
612
I affraid you need to create a field for each type from the name/type collection. Similar problem is solved here:
operator: {
type: 'select',
options: ['over', 'in', 'out', 'atop', 'xor', 'arithmetic'],
},
k1: {
type: 'number',
when: { eq: { operator: 'or' } }
},
k2: {
type: 'number',
when: { eq: { operator: 'arithmetic' } }
},
k3: {
type: 'number',
when: { eq: { operator: 'xor' } }
},
k4: {
type: 'number',
when: { eq: { operator: 'over' } }
}
EDIT:
it's obvious this approach cannot be used in your case... xpath
when: { eq: { 'labels/0/type': 'Number' } } is valid but useless. It's not doable easilly so far, we set up a new issue for this. Would be nice to have something like when: { eq: { '*/type': 'Number' } } where * could be current context, so you would be able to get current index.
answered Jun 14 '16 at 15:21
ladeslades
612
edited Jun 23 '16 at 13:56
answered Jun 14 '16 at 15:21
ladeslades
612
answered Jun 14 '16 at 15:21
ladeslades
612
answered Jun 14 '16 at 15:21
ladeslades
612
612
Could u be more detail ? I edited my post to provide more information. As u can see, i want to set my 'regex' field appear only when my 'type' is 'Date' or 'Number'. Thank you
– K9_HCM Phng Vn Bu
Jun 15 '16 at 9:11
any suggest solution sir ?
– K9_HCM Phng Vn Bu
Jun 23 '16 at 6:50
add a comment |
Could u be more detail ? I edited my post to provide more information. As u can see, i want to set my 'regex' field appear only when my 'type' is 'Date' or 'Number'. Thank you
– K9_HCM Phng Vn Bu
Jun 15 '16 at 9:11
any suggest solution sir ?
– K9_HCM Phng Vn Bu
Jun 23 '16 at 6:50
Could u be more detail ? I edited my post to provide more information. As u can see, i want to set my 'regex' field appear only when my 'type' is 'Date' or 'Number'. Thank you
– K9_HCM Phng Vn Bu
Jun 15 '16 at 9:11
Could u be more detail ? I edited my post to provide more information. As u can see, i want to set my 'regex' field appear only when my 'type' is 'Date' or 'Number'. Thank you
– K9_HCM Phng Vn Bu
Jun 15 '16 at 9:11
any suggest solution sir ?
– K9_HCM Phng Vn Bu
Jun 23 '16 at 6:50
any suggest solution sir ?
– K9_HCM Phng Vn Bu
Jun 23 '16 at 6:50
add a comment |
You have to provide inside the Attribute of particular element..
For example you need to hide the message element based on attr/type option You need to write the code like that..
'message' : {
type : 'text',
group : 'validation',
label : 'Error message',
when: { ne: { 'data/item/type': "Your Option here!!"} },
index : 8
},
Suggestions are welcome!! Thank you
answered Nov 14 '18 at 9:05
KarthikKarthik
2910
Why are you down voting.. is there any suggestion means comment
– Karthik
Nov 14 '18 at 10:22
add a comment |
You have to provide inside the Attribute of particular element..
For example you need to hide the message element based on attr/type option You need to write the code like that..
'message' : {
type : 'text',
group : 'validation',
label : 'Error message',
when: { ne: { 'data/item/type': "Your Option here!!"} },
index : 8
},
Suggestions are welcome!! Thank you
answered Nov 14 '18 at 9:05
KarthikKarthik
2910
Why are you down voting.. is there any suggestion means comment
– Karthik
Nov 14 '18 at 10:22
add a comment |
You have to provide inside the Attribute of particular element..
For example you need to hide the message element based on attr/type option You need to write the code like that..
'message' : {
type : 'text',
group : 'validation',
label : 'Error message',
when: { ne: { 'data/item/type': "Your Option here!!"} },
index : 8
},
Suggestions are welcome!! Thank you
answered Nov 14 '18 at 9:05
KarthikKarthik
2910
You have to provide inside the Attribute of particular element..
For example you need to hide the message element based on attr/type option You need to write the code like that..
'message' : {
type : 'text',
group : 'validation',
label : 'Error message',
when: { ne: { 'data/item/type': "Your Option here!!"} },
index : 8
},
Suggestions are welcome!! Thank you
answered Nov 14 '18 at 9:05
KarthikKarthik
2910
answered Nov 14 '18 at 9:05
KarthikKarthik
2910
answered Nov 14 '18 at 9:05
KarthikKarthik
2910
answered Nov 14 '18 at 9:05
KarthikKarthik
2910
2910
Why are you down voting.. is there any suggestion means comment
– Karthik
Nov 14 '18 at 10:22
add a comment |
Why are you down voting.. is there any suggestion means comment
– Karthik
Nov 14 '18 at 10:22
Why are you down voting.. is there any suggestion means comment
– Karthik
Nov 14 '18 at 10:22
Why are you down voting.. is there any suggestion means comment
– Karthik
Nov 14 '18 at 10:22
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f37742721%2fdisplay-field-based-on-another-in-jointjs%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
