Мой вопрос заключается в том, что я делаю SweetAlerts в моем проекте, но не работает

Question

Я пытаюсь реализовать Sweetalert в своем проекте, но я не могу выбрать проблему там, где она существует, я делаю все правильно, но все еще не преследую свою цель в этом сценарии.Это мой вид:

 @model SSC_MVC.Models.Department

    @{
        // ViewBag.Title = "Create";

        ViewBag.Title = Model.dpt_id == null ? "Create" : "Edit";
    }
    <script src="~/Scripts/jquery-1.12.4.min.js">

    </script>

    <script src="~/Scripts/jquery.validate.min.js"></script>
    <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>

    <link href="~/bootstrap-3.3.6-dist/css/bootstrap.min.css" rel="stylesheet" />
    <script src="~/bootstrap-3.3.6-dist/js/bootstrap.js"></script>

    <script src="https://lipis.github.io/bootstrap-sweetalert/lib/sweet-alert.js"></script>
    <link href="~/Content/sweetalert/sweet-alert.css" rel="stylesheet" />

    <script type="text/javascript">

        function validateData()
        {
            debugger;

            if ($("#dpt_nam").val() == "")
            {
                swal("Please enter Name !");
                return false;
            }  else
            {
                return true;
            }
        }
    </script>
    <h2>Create</h2>
    @using (Html.BeginForm(FormMethod.Post) )
    {
        @Html.AntiForgeryToken()

        <div class="col-md-12 form-horizontal">
            <h4>Department</h4>
            <hr />
            @Html.ValidationSummary(true, "", new { @class = "text-danger" })
            @Html.HiddenFor(model => model.dpt_id)

            <div class="form-group">
                <div class="col-md-2">
                    @Html.Label("Name", htmlAttributes: new { @class = "control-label col-md-2 " })
                </div>
                <div class="col-md-8">
                    @Html.EditorFor(model => model.dpt_nam, new { htmlAttributes = new { @class = "form-control validateData" } })
                    @Html.ValidationMessageFor(model => model.dpt_nam, "", new { @class = "text-danger" })
                </div>
            </div>
     <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    @if (Model.dpt_id == null)
                    {
                        <input type="submit" onclick="Validate(this, event);" value="Create" class="btn btn-primary"  />
                    }
                    else
                    {
                        <input type="submit" value="Edit" class="btn btn-success" />
                    }
                </div>
            </div>
          @{
              var message = TempData["AlertMessage"] ?? string.Empty;
        }

        <script type="text/javascript">
        var message = '@message';
        if(message)
            alert(message);
        </script>
        </div>

    }

    <div>
        @Html.ActionLink("Back to List", "Index")
    </div>

    @*@section Scripts {
        @Scripts.Render("~/bundles/jqueryval")
    }*@

Есть моя модель:

public string dpt_id { get; set; }
 public string dpt_nam { get; set; }
 public string dpt_typ { get; set; }

В представлении #dpt_nam - это свойство моей модели, на самом деле я хочу, когда я нажимаю кнопку подтверждения и еслиПользователь не заполняет отдел Имя, которое показывает предупреждение, например: Пожалуйста, введите Имя!, поэтому в этом случае я создал функцию с именем ValidateData, и вы сможете увидеть ее в виде.кто-нибудь здесь, кто поможет мне?