How to disable a field in a dialog after submit?
I have a dropdown based on which I'm displaying some fields in a component, but after the author has selected an option and submitted the dialog once, they should not be able to change it again. If a different option needs to be selected then the component must be added again to the page and authored from the beginning. Look at the following example:
The first time I open the Test Component dialog I have the freedom to select any of the 4 options, but after submitting and reopening the dialog, I should not be able to select another option, as shown in the example above.
Through jquery, I have tried adding the disabled attribute to the markup on a certain event, and though it doesn't work exactly as shown above, the script is able to disable the dropdown. The problem is that this disabled state does not persist upon reopening the dialog.
Note: In the above example I have managed to illustrate the requirement by first submitting the dialog and then going back to CRXDE and adding the disabled = true property in the field.
Note 2: When I tried adding the disabled attribute through jquery, the dropdown gets disabled and becomes unclickable but it is not grayed out as shown in the example above, therefore the script is able to disable the dropdown, but it's not indicated clearly.
You need to write an js to check dropdown is selected or not. You can use Coral JS API or jquery
$document.on("foundation-contentloaded", function(e) {
var article = $('#test');
if(article.selectedItem!=null){
article.attr("disabled","disabled");
}
}
where dropdown has granite:id property and value id test
Arun Patidar
