ASP.NET 从下拉列表中选择选项时添加数字/文本输入模式

Question

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

                <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 来做到这一点。在您的 html 中添加 <script> 标记并添加此功能。还将onchange="jsFunction(this.value);" 添加到<select> 标记中。我现在使用了一个 javascript 提示，但是你可以在函数被触发时显示和隐藏你的模型。

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>