Asp.net Multiselect DDL onchange event

Question

Multiselect ddl and textbox.

1)whenever i am selecting ddl item and put email in text box for each item manually . i want to add ',' before second email id put in text box.

2) if i am unselecting perticular item form ddl that time regarding textbox email is remove from textbox.

3) i have Email3 and Email4 hardcoded text.

<select id="ddltext" runat="server" data-placeholder="--Select--" multiple class="selectpicker" onchange="GetSelectedValue();">
<option></option>

<option>Email1</option>
<option>Email2</option>
<option>Email3</option>
<option>Email4</option>

<option>Email5</option>
<asp:TextBox ID="txtEmailId" runat="server" CssClass="form-control"></asp:TextBox>

function GetSelectedValue() {
debugger;

var SelectedITem = $(".selectpicker option:selected").text();
// var strUser = SelectedITem.options[SelectedITem.selectedIndex].text();
if (SelectedITem == 'Email3' || SelectedITem == 'Email4') {
txtEmailID.value = "[email protected]";
}
else {
txtEmailID.value = "";
}
}

Jayraj Chhaya · Answer

Hi Amit, To achieve the desired functionalities, you can use JavaScript/jQuery along with ASP.NET code-behind. Here's how you can implement the required logic: Adding a comma before the second email address: Add an onkeyup event to the textbox to detect when the user enters a comma (','). In the event handler, split the textbox value by commas and check the number of email addresses entered. If there are more than one email addresses, add a comma before the second email address. Update the textbox value with the modified email addresses. $('# ').on('keyup', function() { var emailAddresses = $(this).val().split(','); if (emailAddresses.length > 1) { emailAddresses[1] = ',' + emailAddresses[1].trim(); $(this).val(emailAddresses.join(',')); } }); Removing email addresses when an item is unselected: Modify the GetSelectedValue function to handle the removal of email addresses. Check if the selected item is 'Email3' or 'Email4'. If it is, set the textbox value to an empty string. Otherwise, keep it as is. function GetSelectedValue() { var selectedItems = $(".selectpicker option:selected"); var selectedText = selectedItems.text(); var txtEmailID = document.getElementById(' '); if (selectedText === 'Email3' || selectedText === 'Email4') { txtEmailID.value = ""; } }