how to set specific text to dropdown when i select a dropdown value in asp.net core?

Question

I have a drop-down in asp.net core with country name and code. i need, when i select a drop-down value than it should be set a only code in drop-down. I have a screenshot you can see that,

screen Shot

now i have a second screen shot i want to like this drop-down after select value. second Screen Shot

my view drop-down code is

html dropdown is

Jerdine Sabio · Accepted Answer

In this solution, we're wrapping the Country text inside a span tag. Whenever we click on the dropdown, this would fill the span tag with Country property. When you're done choosing an option, this would empty the span tag.

Add this to your script;

$(document).ready(function() {
  $("#countryDropdown").find("option").each(function() {
    var codeIndex = $(this).text().indexOf("(");
    var country = $(this).text().substring(0, codeIndex);
    var code = $(this).text().substring(codeIndex);
    $(this).html("" + code);
  });

  $("#countryDropdown").focus(function() {
    $(this).find(".select-hide").each(function() {
      $(this).text($(this).data("country"));
    });
  });

  $("#countryDropdown").change(function() {
    $(this).blur();
  });

  $("#countryDropdown").blur(function() {
    $(this).find(".select-hide").each(function() {
      $(this).text("");
    });
  });
});

Demo below;

$(document).ready(function() {
  $("#countryDropdown").find("option").each(function() {
    var codeIndex = $(this).text().indexOf("(");
    var country = $(this).text().substring(0, codeIndex);
    var code = $(this).text().substring(codeIndex);
    $(this).html("" + code);
  });

  $("#countryDropdown").focus(function() {
    $(this).find(".select-hide").each(function() {
      $(this).text($(this).data("country"));
    });
  });

  $("#countryDropdown").change(function() {
    $(this).blur();
  });

  $("#countryDropdown").blur(function() {
    $(this).find(".select-hide").each(function() {
      $(this).text("");
    });
  });
});

how to set specific text to dropdown when i select a dropdown value in asp.net core?

Answers (2)

Related Questions