Skip to main content

Notifications

Announcements

No record found.

Customer experience | Sales, Customer Insights,...
Suggested answer

Set Rendering Control to Dropdown with multiselect option-field on embedded form.

(0) ShareShare
ReportReport
Posted on by

Hello everyone,

I have a problem regarding embedded forms on landing pages, when I create a form field who is a multiselect option-field I can´t set Rendering Control to Dropdown or Radio Button like I can with a ordinary optionset field.

This results my form showing all alternatives on my multiselect option field in checkboxes. I want the field to be a dropdown instead.

Has anyone had this problem before and how did you solve it?

Thanks in advance.

  • Nya Profile Picture
    Nya 29,056 on at
    RE: Set Rendering Control to Dropdown with multiselect option-field on embedded form.

    Hi,

    If the issue has been solved, it would be appreciated if you could click "Yes" to verify my answer.

    Image

    If there is any further doubt, please do not hesitate to let me know.

  • Suggested answer
    Nya Profile Picture
    Nya 29,056 on at
    RE: Set Rendering Control to Dropdown with multiselect option-field on embedded form.

    Hi,

    It can be achieved by adjust the HTML of the marketing form.

    Add the field first and then replace the following code with the HTML for the field.

    The script:

    var expanded = false;
    
    function showCheckboxes() {
      var checkboxes = document.getElementById("checkboxes");
      if (!expanded) {
        checkboxes.style.display = "block";
        expanded = true;
      } else {
        checkboxes.style.display = "none";
        expanded = false;
      }
    }

    The CSS:

    .multiselect {
      width: 200px;
    }
    
    .selectBox {
      position: relative;
    }
    
    .selectBox select {
      width: 100%;
      font-weight: bold;
    }
    
    .overSelect {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      bottom: 0;
    }
    
    #checkboxes {
      display: none;
      border: 1px #dadada solid;
    }
    
    #checkboxes label {
      display: block;
    }
    
    #checkboxes label:hover {
      background-color: #1e90ff;
    }

    The HTML for the droplist:

    Here is the effect:

    pastedimage1645088140272v1.png

Under review

Thank you for your reply! To ensure a great experience for everyone, your content is awaiting approval by our Community Managers. Please check back later.

Helpful resources

Quick Links

December Spotlight Star - Muhammad Affan

Congratulations to a top community star!

Top 10 leaders for November!

Congratulations to our November super stars!

Tips for Writing Effective Verified Answers

Best practices for providing successful forum answers ✍️

Leaderboard

#1
André Arnaud de Calavon Profile Picture

André Arnaud de Cal... 291,391 Super User 2024 Season 2

#2
Martin Dráb Profile Picture

Martin Dráb 230,445 Most Valuable Professional

#3
nmaenpaa Profile Picture

nmaenpaa 101,156

Leaderboard

Featured topics

Product updates

Dynamics 365 release plans