Как оформить переменную строку в соответствии с результатом условного оператора?

#asp.net #razor #asp.net-webpages #webmatrix-3

#asp.net #razor #asp.net-веб-страницы #webmatrix-3

Вопрос:

Чтобы упростить эту проблему, я написал базовую инструкцию if / else, которая показывает сообщение «Число правильное!», Если условие выполнено при отправке формы или «Извините. Число неверно!», если условие не выполнено.

 @{
    Layout = "/shared/_SiteLayout.cshtml";

    var num1 = Request["text1"];
    var num2 = "4";
    var totalMessage = "";

    if (IsPost)
    {
        if(num1.AsInt() == num2.AsInt())
        {
            totalMessage = "The number is correct!";
        }
        else
        {
            totalMessage = "Sorry. The number is incorrect!";
        }
    }
}

<br>
<br>
<br>
<br>
<br>

<div style="margin: 0 40px 0 40px">

  <p style="font-weight: bold;">@totalMessage</p>

  <br>
  <p>4   what = 8? amp;nbsp; <strong>Add the missing number</strong>.</p>
  <form action="" method="post">
    <label for="text1">Add Number Here:</label>
    <input type="text" name="text1" />
    <input type="submit" value="Add" />
  </form>
</div>
  

Проблема: как мне оформить переменную под другим цветом, если условие не выполнено?

 @totalMessage
  

Я могу решить проблему, используя вторую переменную в операторе и разметке, затем обернуть переменную в HTML-теги и добавить стиль CSS.

 var totalMessage2 = "";
totalMessage2 = "Sorry. The number is incorrect!";

<style>
.incorrect {
color: red;       
}
</style>

<span class="incorrect">@totalMessage2</span>
  

Но, если условие выполнено, пустой HTML-тег все равно отображается.

Есть ли другой способ сделать это?

Комментарии:

1. Вы могли бы использовать bool для сохранения того, является ли число правильным. Основываясь на значении bool, вы могли бы отобразить диапазон с правильным классом. @{ if(numberIsCorrect) { <span class="correct">@totalMessage</span> } else { <span class="incorrect">@totalMessage</span> }

2. При написании и публикации кода, пожалуйста, не забудьте использовать правильный отступ. Без этого чрезвычайно сложно читать код. Я отредактировал ваш вопрос, чтобы показать, как он должен выглядеть.

3. @Kenci — Похоже, это правильный ответ. Но я упростил проблему с помощью контактной формы, в которой условный оператор заключен в @{ … } в верхней части страницы, а не в разметке. В этом отношении это не сработает, но спасибо.

4. Bool все равно будет доступен в вашей разметке дальше, если вы объявите его вверху, используйте @{ … } для повторного доступа к ней. Я полагаю, что вы также можете записать HTML между этими скобками.

5. @Kenci — Спасибо. Вы правы, и это работает. Я реализовал код для предоставления сообщения об успешном или сбое NuGet BotDetect CAPTCHA в форме электронной почты. Я проголосую за и отмечу xzuttz в качестве ответа.

Ответ №1:

Как упоминал @kenci, вы можете сделать что-то вроде этого:

 @{
    Layout = "/shared/_SiteLayout.cshtml";

    var num1 = Request["text1"];

    var num2 = "4";
    var totalMessage = "";

    bool isCorrectNumber = false;

    if (IsPost)
    {
        if (num1.AsInt() == num2.AsInt())
        {
            totalMessage = "The number is correct!";
            isCorrectNumber = true;
        }
        else
        {
            totalMessage = "Sorry. The number is incorrect!";
            isCorrectNumber = false;
        }
    }
}

<br>
<br>
<br>
<br>
<br>

<div style="margin: 0 40px 0 40px">

    @{
        if (isCorrectNumber)
        {
            <span class="correct">@totalMessage</span>

        }
        else
        {
            <span class="incorrect">@totalMessage</span>

        }
    }
    <br>
    <p>4   what = 8? amp;nbsp; <strong>Add the missing number</strong>.</p>
    <form action="" method="post">
        <label for="text1">Add Number Here:</label>
        <input type="text" name="text1" />
        <input type="submit" value="Add" />
    </form>
</div>
  

Ответ №2:

Закомментируйте IsPost , это сработает. Вы должны проверять IsPost только в контроллере.

 //if(IsPost){
        if(num1.AsInt() == num2.AsInt()) {
            totalMessage = "The number is correct!";
        }
        else
        {
            totalMessage = "Sorry. The number is incorrect!";
        }
    //}
  

Комментарии:

1. Это генерирует «Извините. Число неверно!» при загрузке страницы, потому что оператор обрабатывается без публикации пользовательского ввода

2. Если проверка завершится неудачей, она вернет View is GET, а не POST

3. @ Hien Nguyen — ‘ViewBag’ не существует в текущем контексте. Это не MVC, а веб-страницы. В любом случае спасибо.

4. вы изменили IsPostBack вместо IsPost?