Mam dużo divs pod sobą, a potem wybrano wartość i prawda, że chcę kolejny div do pokazania. Wiem, że mogę zrobić to z JavaScriptem, ale jak mogę zrobić z brzytwą?
Oto część mojego kodu,
<div id="Attend">
@Html.DropDownListFor(model => model.AttendWedding, new[]
{
new SelectListItem() {Text = "Yes, I'll be there", Value = bool.TrueString },
new SelectListItem() {Text ="No, I can't come", Value = bool.FalseString }
}, "Choose an option")
</div>
<div id="Hotel">
@Html.DropDownListFor(model => model.WillStayAtHotel, new[]
{
new SelectListItem() {Text = "Yes, I will stay at the hotel", Value = bool.TrueString},
new SelectListItem() {Text ="No, I won't stay at the hotel", Value = bool.FalseString }
}, "Choose an option")
</div>
<div id="Nights">
@Html.LabelFor(model => model.HowManyNights, "How Many Nights?:", new { @class = "dob" })
1
@Html.RadioButtonFor(model => model.HowManyNights, new { style = "width: 1000px; height:50px; overflow:hidden;" })
2
@Html.RadioButtonFor(model => model.HowManyNights, new { style = "width: 1000px; height:50px; overflow:hidden;" })
3
@Html.RadioButtonFor(model => model.HowManyNights, new { style = "width: 1000px; height:50px; overflow:hidden;" })
4
@Html.RadioButtonFor(model => model.HowManyNights, new { style = "width: 1000px; height:50px; overflow:hidden;" })
<br />
5
@Html.RadioButtonFor(model => model.HowManyNights, new { style = "width: 1000px; height:50px; overflow:hidden;" })
6
@Html.RadioButtonFor(model => model.HowManyNights, new { style = "width: 1000px; height:50px; overflow:hidden;" })
7
@Html.RadioButtonFor(model => model.HowManyNights, new { style = "width: 1000px; height:50px; overflow:hidden;" })
8
@Html.RadioButtonFor(model => model.HowManyNights, new { style = "width: 1000px; height:50px; overflow:hidden;" })
</div>
<div id="When">
@Html.TextBoxFor(model => model.StartDate, "{mm/dd/yyyy}",new {@class="datepicker"})
@Html.TextBoxFor(model => model.EndDate, "{mm/dd/yyyy}", new { @class = "datepicker" })
</div>
Więc kiedy ludzie klikną, będę uczestniczyć wtedy Div "Hotel" powinien pokazać i tak dalej.
Wdzięczny za wszelką pomoc.
2 odpowiedzi
Musisz użyć JavaScript dla tej funkcjonalności, ponieważ jest po stronie klienta. A brzytwy jest analizowany przez serwer ... Ourourse Istnieje możliwość wysyłania formularza po formularzu kogoś postów do serwera i pokaż więcej pól po stronie. Ale dziś nie ma żadnych niej. ;)
Jeśli ktoś jest zainteresowany, to moje rozwiązanie i kod, dzięki za wcześniejszą pomoc:
<script>
hideAllDivs = function () {
$("#Hotel, #Nights, #When").hide();
};
handleNewSelection = function () {
hideAllDivs();
switch ($(this).val()) {
case 'True':
$("#Hotel").show();
break;
case 'False':
$("#Hotel").hide();
break;
}
};
$(document).ready(function () {
$("#AttendWedding").change(handleNewSelection);
// Run the event handler once now to ensure everything is as it should be
handleNewSelection.apply($("#AttendWedding"));
});
</script>
<script>
hideAllDivs1 = function () {
$("#Nights, #When").hide();
};
handleNewSelection1 = function () {
hideAllDivs1();
switch ($(this).val()) {
case 'True':
$("#Nights").show();
break;
case 'False':
$("#Nights").hide();
break;
}
};
$(document).ready(function () {
$("#WillStayAtHotel").change(handleNewSelection1);
// Run the event handler once now to ensure everything is as it should be
handleNewSelection1.apply($("#WillStayAtHotel"));
});
</script>
<script>
hideAllDivs2 = function () {
$("#When").hide();
};
handleNewSelection2 = function () {
hideAllDivs2();
switch ($(this).val()) {
case '1':
$("#When").show();
break;
case '2':
$("#When").show();
break;
case '3':
$("#When").show();
break;
case '4':
$("#When").show();
break;
case '5':
$("#When").show();
break;
case '6':
$("#When").show();
break;
case '7':
$("#When").show();
break;
case '8':
$("#When").show();
break;
case '':
$("#When").hide();
break;
}
};
$(document).ready(function () {
$("#HowManyNights").change(handleNewSelection2);
// Run the event handler once now to ensure everything is as it should be
handleNewSelection2.apply($("#HowManyNights"));
});
</script>
Nowe pytania
c#
C # (wymawiane „patrz ostro”) jest językiem programowania wysokiego poziomu, statycznie typowanym, wieloparadygmatowym opracowanym przez firmę Microsoft. Kod C # zwykle jest przeznaczony dla rodziny narzędzi Microsoft .NET i czasów wykonywania, do których należą między innymi .NET Framework, .NET Core i Xamarin. Użyj tego tagu w przypadku pytań dotyczących kodu napisanego w C # lub C # formalnej specyfikacji.