Мост из мира .NET в мир JavaScript

protected void submitButton_OnClick(object sender, EventArgs e)
{
    var isCorrect = IsCorrectPlateNumber(plateTextBox.Text);
    plateTextBox.BackColor = isCorrect ? Color.LightGreen : Color.Coral;
}
private static bool IsCorrectPlateNumber(string plateNumber)
{
    var success = false;
    if (!string.IsNullOrWhiteSpace(plateNumber))
    {
        plateNumber = plateNumber.Trim();
        if (plateNumber.Length >= 8 || plateNumber.Length <= 9)
        {
            var rgx = new Regex(@"^[АВЕКМНОРСТУХавекмнорстух]d{3}[АВЕКМНОРСТУХавекмнорстух]{2}d{2,3}$");
            success = rgx.IsMatch(plateNumber);
        }
    }
    return success;
}

Рег. номер автомобиля (формат X 000 XX 000):<br/>
<asp:TextBox ID="plateTextBox" runat="server"/>
<asp:Button ID="submitButton" runat="server" Text="Проверить" OnClientClick="return validatePlate();" OnClick="submitButton_OnClick"/>

function validatePlate() {
    var value = document.getElementById('<%=plateTextBox.ClientID%>').value;
    if (value && value.length) {
        return true;
    }
    alert("Введите рег. номер автомобиля!");
    return false;
}

(function (globals) {
    "use strict";

    Bridge.define('Demo.ServerLogic', {
        statics: {
            isCorrectPlateNumber: function (plateNumber) {
                var success = false;
                if (!Bridge.String.isNullOrWhiteSpace(plateNumber)) {
                    plateNumber = plateNumber.trim();
                    if (plateNumber.length >= 8 || plateNumber.length <= 9) {
                        var rgx = new Bridge.Text.RegularExpressions.Regex("constructor", "^[АВЕКМНОРСТУХавекмнорстух]\d{3}[АВЕКМНОРСТУХавекмнорстух]{2}\d{2,3}$");
                        success = rgx.isMatch(plateNumber);
                    }
                }
                return success;
            }
        }
    });

    Bridge.init();
})(this);

Нам остается подключить файл Bridge.js (для простоты я взял файл скрипта из онлайн редактора), а также немного модифицировать нашу первоначальную функцию валидации:

function validatePlate() {
    var value = document.getElementById('<%=plateTextBox.ClientID%>').value;
    if (Demo.ServerLogic.isCorrectPlateNumber(value)) {
        return true;
    }
    alert("Неверный рег. номер автомобиля!");
    return false;
}

2. Установим в него Nuget пакет ^[5]. Устанавливайте этот пакет в отдельный проект, т.к. при установке удаляются конфликтующие References.

3. В проекте WebApplication1 вынесем логику в отдельный файл/класс. Соответственно, теперь этот класс будет использован в обработчике события нажатия на кнопку (изменения понятны, код не привожу).

using System.Text.RegularExpressions;

namespace WebApplication1
{
    public class ServerLogic
    {
        public static bool IsCorrectPlateNumber(string plateNumber)
        {
            var success = false;
            if (!string.IsNullOrWhiteSpace(plateNumber))
            {
                plateNumber = plateNumber.Trim();
                if (plateNumber.Length >= 8 || plateNumber.Length <= 9)
                {
                    var rgx = new Regex(@"^[АВЕКМНОРСТУХавекмнорстух]d{3}[АВЕКМНОРСТУХавекмнорстух]{2}d{2,3}$");
                    success = rgx.IsMatch(plateNumber);
                }
            }
            return success;
        }
    }
}

4. Добавим созданный файл в проект WebApplication1.Bridge как ссылку ^[6]

5. Изменим output директорию для проекта WebApplication1.Bridge. Для этого настроим в файле bridge.json:

"output": "../WebApplication1/Scripts/Bridge"

6. После сборки в Solution Explorer нажмем Show All Files и сможем увидеть сгенерированный скрипт webApplication1.js

7. Добавим нужные ссылки и обновим скрипты на странице Demo.aspx:

<script src="Scripts/Bridge/bridge.js" type="text/javascript"></script>
<script src="Scripts/Bridge/webApplication1.js" type="text/javascript"></script>
<script type="text/javascript">
function validatePlate() {
    var value = document.getElementById('<%=plateTextBox.ClientID%>').value;
    if (WebApplication1.ServerLogic.isCorrectPlateNumber(value)) {
        return true;
    }
    alert("Неверный рег. номер автомобиля!");
    return false;
}
</script>

8. Всё. Можно собирать проект и запускать. Теперь любые изменения в логику валидации будут автоматически работать как для серверной проверки, так и для клиентской.