ASP.NET 从下拉列表中选择选项时添加 number/text 输入模式

ASP.NET Add a number/text input modal when selecting an option from a dropdown list

所以我想弄清楚如何 select 从 ASP.net 的下拉列表中选择一个选项,当您 select 选择“自定义定价”选项时,会弹出一个模式最多输入一个文本金额,该金额将成为该值。所以有人 select 选择了自定义价格选项,应该会弹出一个数字输入模式,他们输入他们的价格,它就会显示在“自定义定价”所在的“值”下方。如果有人能帮助我,那就太好了!

                <div class="inputs">
                    <label asp-for="PriceMultiplier" asp-postfix=":"></label>
                    <select name="PriceMultiplier">
                        <option value="0">Hide Pricing</option>
                        <option value="1">Net Pricing</option>
                        <option value="2">2x</option>
                        <option value="2.5">2.5x</option>
                        <option value="3">3x</option>
                        <option value="{}">Custom Pricing</option>
                    </select>
                </div>

您可以使用 JavaScript 来完成此操作。将 <script> 标记添加到您的 html 并添加此功能。同时将 onchange="jsFunction(this.value);" 添加到 <select> 标签。我现在使用了 javascript promt,但您可以在触发该功能时显示和隐藏您的模型。

function jsFunction(value) {
  if(value == 'custom'){
    var NewValue = prompt("Please enter your price");
    document.querySelector("[value='custom']").textContent = NewValue;
    document.querySelector("[value='custom']").value = NewValue;
  }
}
  <select name="PriceMultiplier" onchange="jsFunction(this.value);">
    <option value="0">Hide Pricing</option>
    <option value="1">Net Pricing</option>
    <option value="2">2x</option>
    <option value="2.5">2.5x</option>
    <option value="3">3x</option>
    <option value="custom">Custom Pricing</option>
  </select>