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

Question

所以我想弄清楚如何 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>

Answer 1

您可以使用 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>

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

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

c#

jquery

asp.net

.net

selectlist