0

In my web application, for the select element I'm loading options from javascript.

By default, it selected the 1st data in the options.

I wanted to remove the default selection or add a placeholder like Select the item likewise.

This is the summarized current code that I wanted to show you.

'<td width="40%">' +
 <select onchange="sendInfo(this)" class="form-select ItemId" data-id= '+counter+' name="Item_Id[' +counter +']" id="ItemId[' + counter +']" required="required" ' +
"</select>" +"</td>"


var selectElement = newRow.find("select"); 

 dropdownOptions.forEach(function (option) {

  var optionElement = $("<option>").val(option.Value).text(option.Text);          
  selectElement.append(optionElement);
  });

newRow.appendTo("#submissionTable");
selectElement.select2({ width: "100%" });
Dev Beginner
  • 589
  • 1
  • 11
  • https://select2.org/placeholders: _"For single selects only, in order for the placeholder value to appear, you must have a blank – CBroe Jun 07 '23 at 05:33
  • @CBroe I went to your link and then I did ``newRow.appendTo("#submissionTable"); selectElement.select2({ width: "100%", placeholder: "Select a item", allowClear: true });`` But it still not adding the placeholder, Now there is a close button and when I click it then placeholder appears. – Dev Beginner Jun 07 '23 at 06:12
  • _"you must have a blank – CBroe Jun 07 '23 at 06:14
  • @CBroe forgot and now It is fixed. Thank you. How Can I mark your comment as an answer ? – Dev Beginner Jun 07 '23 at 06:21

0 Answers0