Как изменить текст заполнителя, если пользователь выбирает параметры - PullRequest
Новая
       4

Как изменить текст заполнителя, если пользователь выбирает параметры

1 голос
/ 19 апреля 2019

В настоящее время у меня есть 2 варианта значения в моей группе форм asp, где один представляет страну, а другой - для штата / провинции. Есть ли способ поменять текст?

Например, когда пользователь выбирает Канаду, текст заполнителя будет провинцией, где при выборе U.S заполнителем будет штат. 

<form>
<div class="form-group">
     <select asp-for="Country" class="form-control" required="required">
         <option value="Canada">Canada</option>
         <option value="U.S">U.S</option>
      </select>
</div>

<div class="form-group">
    <input asp-for="State" class="form-control" placeholder="Province" />
    <span asp-validation-for="State" class="text-danger"></span>
</div>

<button type="submit"> Submit </button>
<form>

Ответы [ 3 ]

3 голосов
/ 19 апреля 2019

Вы можете добиться этого, используя jquery или javascript. Проверьте мой фрагмент кода ниже. 

<form>
<div class="form-group">
     <select asp-for="Country" id="Country" class="form-control" required="required">
         <option value="Canada">Canada</option>
         <option value="U.S">U.S</option>
      </select>
</div>

<div class="form-group">
    <input asp-for="State" id="State" class="form-control" placeholder="Province" />
    <span asp-validation-for="State" class="text-danger"></span>
</div>

<button type="submit"> Submit </button>
<form>

<script>
  $(document).on("change","#Country",function(){
    var value=$(this).val();
    if(value === "Canada"){
      $("#State").prop("placeholder","Province");
    }
    else if (value === "U.S" ){
      $("#State").prop("placeholder","State");
    }
  });
</script>
0 голосов
/ 20 апреля 2019 
    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="test" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:DropDownList ID="ddlCountry" runat="server" OnSelectedIndexChanged="Country_SelectedIndexChanged" AutoPostBack="true">
                <asp:ListItem Value="Canada" Text="Canada"></asp:ListItem>
                <asp:ListItem Value="USA" Text="USA"></asp:ListItem>
            </asp:DropDownList>

        </div>
         <br />
            <asp:TextBox ID="txtShow" runat="server"></asp:TextBox>
    </form>
</body>
</html>



    ----------------------------aspx.cs code---------------------------------------

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;

    public partial class test : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }

        protected void Country_SelectedIndexChanged(object sender, EventArgs e)
        {
            if(ddlCountry.SelectedValue.ToString() == "USA")
            {
                txtShow.Attributes.Add("Placeholder", "State");
            }

            if (ddlCountry.SelectedValue.ToString() == "Canada")
            {
                txtShow.Attributes.Add("Placeholder", "Province");
            }
        }
    }
0 голосов
/ 19 апреля 2019

Вы можете сделать это несколькими способами, см. Пример кода ниже 

<form>
<div class="form-group">
    <select asp-for="Country" class="form-control" required="required" id="slCountry" onchange="changeCountry()">
        <option value="Canada">Canada</option>
        <option value="U.S">U.S</option>
    </select>
</div>

<div class="form-group">
    <input asp-for="State" class="form-control" id="txtState" placeholder="Province" />
    <span asp-validation-for="State" class="text-danger"></span>
</div>

<button type="submit"> Submit </button>
</form>

<script>
function changeCountry() {
    if ($("#slCountry").val() == "Canada") {
        document.getElementById("txtState").setAttribute("placeholder", "Province")
    } else {
        document.getElementById("txtState").setAttribute("placeholder", "State")
    }
}
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...