How to hide a field based on the dropdown value change.
I added a input field called 'A'. I have a drop-down field. If I select a value in the drop down, say 'Remove field A', then the input field should be removed.
I tried removeField. But it did not work. Any other methods? or how to use remove-field correctly?
this.appendDummyInput()
.setAlign(Blockly.ALIGN_RIGHT)
.appendField('Type ')
.appendField(new Blockly.FieldDropdown(typeOptions), 'columnType');
// if columnType = Card, show the following:
this.appendDummyInput()
.setAlign(Blockly.ALIGN_RIGHT)
.appendField(' Card: ')
.appendField(new Blockly.FieldDropdown(cardsList), 'cardValue');
// if columnType = view, show the following:
this.appendDummyInput()
.setAlign(Blockly.ALIGN_RIGHT)
.appendField(' View ')
.appendField(new Blockly.FieldDropdown(viewsList), 'viewValue');
Okay, so this doesn't have your full code, but I think I see your problem here.
The short answer is that, in your provided code, I don't see you doing anything in the callback functions when selecting a new value in your block, nor do I see you saving it from/reading it from the XML. It's possible some of this was left out, but in the interest of not making you play "include more code" tag in the comments, I'll just do a rundown here.
Let me show you some sample code and walk through what all I do in order to make this case work:
A few things to note about this situation, in addition to my explanatory comments:
this.columnType
construction. Instead, you can pass acolumnType
value intoupdateShape
and usethis.getFieldValue('typeSelector')
or the input of your 'callback' function (handleTypeSelection
). I tend to prefer this because I often make much more complicated blocks where it's hard or inefficient to get the appropriate value every time, andthis.whateverMyValueNameIs
is easier.this.removeInput
andthis.appendDummyInput
inupdateShape
, you can useremoveField
andappendField
, as was your first instinct. However, if you do this, you will need to make sure that you have named the input you intend to append your field to/remove it from. I tend to prefer just adding/removing the entire input in most cases because it also lets me change out labels, etc.domToMutation
andmutationToDom
to save that value to the mutation attribute and then read it out and update your block accordingly. This applies even if you don't have an actual mutator on your block.This can be a bit confusing, so please ask any follow-up questions if you have them. It took me a while to get the hang of it, myself. (I may request additional code samples from you if I'm not clear on what you're trying to do, though.)
Good luck!