How to hide an input element when selecting a radiobutton in mvc asp.net?

Question

How to hide an input element when selecting a radiobutton in mvc asp.net?

Navigation

#1 by (0 votes)
#2 by (0 votes)

0

I am new to this working environment using aspnet and I would like to know if there is a way to show an input when selecting an item on the radio button without trying to use javascript.

Method created in the controller called tg04Personas

public string radio(FormCollection frm)
    {
        string genderradio = frm["personaTipo"].ToString();
        if (genderradio == "natural")
        {
            Response.Redirect("~/tg04Personas/CreateNatural");
            return "";
        }
        else if (genderradio == "juridica")
        {
            Response.Redirect("~/tg04Personas/Create");
            return "";
        }
        {
            Response.Redirect("~/tg04Personas");
            return "";
        }
    }

Created View

@model PiramideWeb.Models.tg04Personas
@{
ViewBag.Title = "Choose";
}
<h2>Selccione el tipo de Persona</h2>
@using (Html.BeginForm("radio", "tg04Personas", FormMethod.Post))
{
<div class="form-group">
    @Html.LabelFor(model => model.personaTipo, htmlAttributes: new { @class = "control-label col- md-2" }) <br />
    <div class="col-md-10">
        Natural @Html.RadioButton("personaTipo", "natural",true, new { htmlAttributes = new { @class = "form-control"} })
        Juridica @Html.RadioButton("personaTipo", "juridica", new { htmlAttributes = new { @class = "form-control"} })
        Extranjera @Html.RadioButton("personaTipo", "extranjera", new { htmlAttributes = new { @class = "form-control"} })
    </div>
</div>
<input type="submit" value="Seleccionar" />
}

Doubt
- You can call the method without having to click on the submit button dynamically, or you can not perform this action. I appreciate your attention.

c# asp.net-mvc razor

asked by ecst1999 05.09.2018 в 19:40

source

2 answers

Problem to pass values by URL (GET) in PHP Compare items from two lists in Haskell

score 0 · Answer 1

I leave the code and the example in CodePen

<label for="show"><span>(Mostrar)</span></label>
<input type=radio id="show" name="group">
<label for="hide"><span>(Ocultar)</span></label>    
<input type=radio id="hide" name="group">
<input id="content" placeholder="Saludos">

input {
    display:none;
}

span#content {
    display:none;
}

input#show:checked ~ span#content{
  display:block;
}

input#show:checked ~ label#id1{
  display:none;
}
input#show:checked ~ label#id2{
  display:block;
}

input#hide:checked ~ label#id2{
  display:none;
}
input#hide:checked ~ label#id1{
  display:block;
}
input#hide:checked ~ span#content{
    display:none;
}

Greetings.

score 0 · Answer 2

Directly by javascript I see it easier:

<input type="radio" id="rdBtn" onclick="if(document.getElementById('rdBtn').checked===true){document.getElementById('texto').style.display ='';}else{document.getElementById('texto').style.display = 'none';}"/>

<input type="text" id="texto" style="display:none"/>