无法在视图上动态呈现标签标记

本文关键字:标签 动态 视图 | 更新日期: 2023-09-27 18:18:14

我在.cshtml文件中有下面一段代码。

<div class="row">
            <input type="text" placeholder="Enter POR ID" id="porID" class="col-md-2 input-sm" name="porTextBox">
            <button class="btn btn-primary col-md-2 btn-sm" style="margin-left:15px;width:150px;" type="submit" id="btnCreateTFSItems"><strong>Create TFS Items</strong></button>
            @if (TempData["formState"] != null)
            {
                //@Html.Label("lblsuccess", "Successfully created TFS Work Items!")
                <label id="lblsuccess" style="color:green; visibility:visible">   Successfully created TFS Work Items!</label>
            }
        </div>

,按钮在script标签中调用以下函数:

<script type="text/javascript">
$(document).ready(function (e) {
    $('#btnCreateTFSItems').click(function () {
        var txt = $('#porID');
        var errorLabel = $('#lblError');
        if (txt.val() != null && txt.val() != '') {
            //alert('clicked');
            $.ajax({
                url: '@Url.Action("CreateWorkItems", "Tables")',
                type: 'POST',
                data: { 'porTextBox': $('#porID').val() }
            });
           // alert('Successfully added');
        }
        else {
            errorLabel.text("Please enter valid PORID");
            return false;
        }
    });
    $("#porID").keypress(function (e) {
        var errorLabel = $('#lblError');
        errorLabel.text("");
        //if the letter is not digit then display error and don't type anything
        if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
            return false;
        }
    });
});

问题是在.cshtml文件中,它正在检查条件,但没有添加标签。原因可能是因为页面没有刷新以呈现标签。我是新的UI开发,所以我已经尝试了某些选项,我在网上发现,但无法使其工作。有什么办法可以做到这一点吗?

无法在视图上动态呈现标签标记

原因可能是页面没有刷新来呈现标签。

。您使用JQuery(客户端脚本)向服务器发出Ajax请求,并期望执行Razor代码(服务器代码)来显示标签。这不起作用,因为服务器代码不知道客户端代码的任何信息。

解决方案是通过JQuery显示标签。默认情况下渲染它,但是用CSS隐藏它(display:none)。请求成功后,您可以通过使用JQuery设置CSS显示属性为"block"或"inline"来显示标签。

相关文章: