This discussion is archived
2 Replies Latest reply: Sep 27, 2012 7:34 AM by Tapas Bose RSS

Profile - Dynamically make a field required

Tapas Bose Newbie
Currently Being Moderated
I have two dependent dropdown menu in the check-in form. First one contain Yes/No. Depending on the choice I want to make second dropdown required or not. Say User choose No, then the second dropdown will be a required field again the user select Yes, then it will turns into non-required field. Is there any way to achieve or it feasible?
Thanks.
  • 1. Re: Profile - Dynamically make a field required
    jiri.machotka Guru
    Currently Being Moderated
    It is feasible, but not with profiles. Profiles are server-side definition how check-in/search params/update forms should look like. You are looking for a client-side action. OOTB it is similar to dependent choice lists (http://docs.oracle.com/cd/E23943_01/doc.1111/e10978/c04_metadata.htm#sthref141 ). If you know potential answers for the second dropdown you could add the blank option (non-required). There's been few posts on this topic recently.

    Alternatively, you will need to customize the checkin form where a Javascript will do the necessary for you.
  • 2. Re: Profile - Dynamically make a field required
    Tapas Bose Newbie
    Currently Being Moderated
    This problem is solved. I solved it by overriding two dynamic HTML:

    1. std_js_bootstrap_vars
    2. compute_std_field_overrides
    According to the requirement, I need to change the requiredness of three
    fields. I am providing the code, this code contain the operation for one
    field, for sake of simplicity.

    By overriding the std_js_bootstrap_vars I have added jQuery event
    listener which changes the color of the field as below:
    <@dynamichtml std_js_bootstrap_vars@>
    <$include super.std_js_bootstrap_vars$>
    <$if IsLoggedIn$>
    <script type="text/javascript"
    src="<$HttpRelativeWebRoot$>globalassets/jquery-1.7.2.min.js"></script>
    <script type="text/javascript">
    $('document').ready(function () {
    var dpTriggerValue =
    $('input[name=dpTriggerValue]').val();
    if(dpTriggerValue == 'DAMMedia' || dpTriggerValue ==
    'DAMVideo' || dpTriggerValue == 'DAMFile') {
    var mediaRightSelect =
    $('select[name=xDAMMediaRights_Options]');
    var mediaRightParentTr =
    $(mediaRightSelect).parent().parent().parent();
    var mediaRightLabel =
    $(mediaRightParentTr).children('td').eq(0).children('label').eq(0);
    var mediaRightOriginalText =
    $(mediaRightLabel).html();
    
    $('select[name=xDAMFullRights]').change(function(event){
    var fullRights = $(event.target).val();
    
    if(fullRights == 1 || fullRights == '') {
    
    $(mediaRightLabel).html(mediaRightOriginalText);
    
    $(mediaRightParentTr).removeClass('idcRequiredEntry');
    } else {
    $(mediaRightLabel).html('*' +
    mediaRightOriginalText);
    
    $(mediaRightParentTr).addClass('idcRequiredEntry');
    }
    });
    }
    });
    </script>
    <$endif$>
    <@end@>
    And for validation I did it as:
    <@dynamichtml compute_std_field_overrides@>
    <$include super.compute_std_field_overrides$>
    <$if isNew or isCheckin or isUpdate$>
    <$if strEquals(fieldName,"xDAMFullRights")$>
    <$fieldExtraScriptInclude = "validate_media_right_js"$>
    <$endif$>
    <$endif$>
    <@end@>
    
    <@dynamichtml validate_media_right_js@>
    var fullRights = form.elements['xDAMFullRights'];
    var index = fullRights.selectedIndex;
    value = '';
    if (index >= 0) {
    value = fullRights.options[index].value;
    
    if (value != null && value.length > 0) {
    if(value == 0) {
    var mediaRights = form.elements['xDAMMediaRights'];
    var valid =
    validateRights(form.elements['xDAMMediaRights'], 'Media Usage');
    if(valid == false) {
    return;
    }
    }
    }
    }
    
    function validateRights(field, message) {
    if(field && field.type == 'select-one') {
    var index = field.selectedIndex;
    if (index >= 0) {
    value = field.options[index].value;
    if (value == null) {
    value = field.options[index].text;
    }
    } else {
    value = '';
    }
    } else {
    value = field.value;
    }
    
    if(value == null || $.trim(value).length == 0) {
    alert(message + ' is required');
    return false;
    } else {
    return true;
    }
    }
    <@end@>
    And it works.
    Regards.

Legend

  • Correct Answers - 10 points
  • Helpful Answers - 5 points