Multiselect option in power portal

[skjangir0460]

Multiselect Options Solutions in PowerApps Portals Form,

We have to set up two column in database (cds) table(entity). One (socialmediatype) is your which store comma seperated value, and second (socialmediatypehide) is which show on form but hide by js.

1. ‘socialmediatype’ this text field column will add on form and hide by js.
2. ‘socialmediatypehide’ this text field column will not add on form only save values.

Add below js in Portal management > Webpages> Advanced

var socialmediatype = $('#cr8d8_socialmediatype');

socialmediatype .hide();

var multiselect = $('<select multiple><option value="948180000">Facebook</option><option value="948180001">Instagram</option><option value="948180001">Whatsapp</option></select>');

multiselect.val(socialmediatype.val().split(','));

multiselect.insertAfter(socialmediatype).multiselect();

multiselect.change(function() {

socialmediatype.val($(this).val());

});

Add below code in your C# plug in.

using System;

using Microsoft.Xrm.Sdk;

namespace PluginsDemo

{

public class Post : IPlugin

{

public void Execute(IServiceProvider serviceProvider)
{
var context = (IPluginExecutionContext)serviceProvider.GetService(typeof(IPluginExecutionContext));

var entity = context.InputParameters["Target"] as Entity;

if (entity.Attributes.ContainsKey("cr8d8_socialmediatype"))
{
OptionSetValueCollection socialmedia = new OptionSetValueCollection();
foreach (var option in entity.Attributes["cr8d8_socialmediatype"].ToString().Split(','))
{
socialmedia.Add(new OptionSetValue(int.Parse(option)));
}

entity["cr8d8_socialmediatypehide"] = socialmedia;
}
else if (entity.Attributes.ContainsKey("cr8d8_socialmediatypehide"))
{
entity["cr8d8_socialmediatype"] = string.Join(",", entity.Attributes["cr8d8_socialmediatypehide"].ToString());
}
}

}

}

Here is the magic.Now you can get and set all social media types.