个人中心
gpt4 book ai didi

c# - MVC Razor EditorFor Display Field help 当鼠标悬停在字段 aka 工具提示上时

转载 作者：行者123 更新时间：2023-12-04 00:33:31 25 4
gpt4 key购买 nike

对于数据输入字段，我想在用户将鼠标悬停在该字段上时向他们显示提示。字段名称是 INACT，表示记录是否已被停用。需要这样的东西 - 输入 I 以停用记录。

我在模型元数据中有这个

    [Display(Name = "INACT")]
    [DisplayFormat(ConvertEmptyStringToNull = true)]
    [StringLength(1)]
    public string A_INACT;

并在非事件 View 中显示 - 此 View 是唯一可以编辑此字段的地方。 :

    <div class="editor-label">    
      @Html.LabelFor(model => model.A_INACT) 
   </div>
   <div class="editor-field">
        @Html.EditorFor(model => model.A_INACT , new { htmlAttributes = new { tabindex = 1 } })                
        @Html.ValidationMessageFor(model =>Model.A_INACT)   
   </div>

INACT 观点

  @model MTSapp.Models.mts_rename

   @{
    ViewBag.Title = "Inact";

   }
  <style>
   .container {
    width: 50%;
    float: left;
   }
  </style>

 <h2>RE NAME </h2>
  <h2>Inact Re Number</h2>

 @using (Html.BeginForm())
{

@Html.ValidationSummary(true)

<fieldset>
    <legend>mts_rename</legend>

<br />



<div class="editor-label">
    @Html.LabelFor(model => model.A_ID)
</div>
<div class="editor-field">
    @Html.TextBoxFor(model => model.A_ID, new { @class = "form-control", @readonly = "readonly", @style = "background:#f2f3f3", tabindex = 4 })
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.A_RENO)
</div>
<div class="editor-field">
    @Html.TextBoxFor(model => model.A_RENO, new { @class = "form-control", @readonly = "readonly", @style = "background:#f2f3f3", tabindex = 5 })
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.A_INACT)
</div>
<div class="editor-field">
    <span class="SpaceAvailableSearch">@Html.EditorFor(model => model.A_INACT, new { htmlAttributes = new { tabindex = 1, title = "Enter I to Inactivate Record" } }) </span>
    @Html.ValidationMessageFor(model => model.A_INACT)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.A_NAME)
</div>
<div class="editor-field">
    @Html.TextBoxFor(model => model.A_NAME, new { @class = "form-control", @readonly = "readonly", @style = "background:#f2f3f3", tabindex = 6, @title = "This is the RE NAME." })
</div>




<p>
    <input type="submit" value="Save" />
</p>
</fieldset>
 }

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

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

Inact Page displayed in IE

这是查看源代码:

      <!DOCTYPE HTML>
      <html lang="en">
      <head>
        <meta charset="utf-8" />
        <title>Inact -  MTS Application</title>
        <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
        <meta name="viewport" content="width=device-width" />
        <link href="/Content/site.css" rel="stylesheet"/>

        <script src="/Scripts/modernizr-2.5.3.js"></script>

        <link href="/Content/Myspec" rel="stylesheet" type="text/css" />

        <link href="/Content/PagedList.css" rel="stylesheet"/>


      </head>
      <body>
        <header>
            <div class="content-wrapper">
                <div class="float-left">
                    <p class="site-title"><a href="/">MATERIAL TEST SYSTEM</a></p>
                </div>

                <div class="float-right">
                    <section id="login">
                        Hello how are you today, <span class="username">AHTD\mase347</span>!
                    </section>
                    <nav>
                        <ul id="menu">
                            <li><a href="/">Home</a></li>
                            <li><a href="/Home/Login">Login</a></li>
                            <li><a href="/Home/About">About</a></li>
                            <li><a href="/Home/Contact">Contact</a></li>
                        </ul>
                    </nav>
                </div>
            </div>
        </header>
        <div id="body">

            <section class="content-wrapper main-content clear-fix">

<style>
    .container {
        width: 50%;
        float: left;
    }
</style>

<h2>RE NAME </h2>
<h2>Inact Re Number</h2>

<form action="/MTS_RENAME/Inact/1" method="post">    <fieldset>
        <legend>mts_rename</legend>

        <br />



        <div class="editor-label">
           <label for="A_ID">ID</label> 
        </div>
        <div class="editor-field">
           <input class="form-control" data-val="true" data-val-number="The field ID must be a number." data-val-required="The ID field is required." id="A_ID" name="A_ID" readonly="readonly" style="background:#f2f3f3" tabindex="4" type="text" value="1" /> 
        </div>

         <div class="editor-label">
          <label for="A_RENO">RE NUMBER</label>
        </div>
        <div class="editor-field">
          <input class="form-control" data-val="true" data-val-length="The field RE NUMBER must be a string with a maximum length of 3." data-val-length-max="3" id="A_RENO" name="A_RENO" readonly="readonly" style="background:#f2f3f3" tabindex="5" type="text" value="1" />
        </div>

         <div class="editor-label">
          <label for="A_INACT">INACT</label> 
        </div>
        <div class="editor-field">
         <span class="SpaceAvailableSearch"> <input class="text-box single-line" data-val="true" data-val-length="The field INACT must be a string with a maximum length of 1." data-val-length-max="1" id="A_INACT" name="A_INACT" type="text" value="" /> </span>
            <span class="field-validation-valid" data-valmsg-for="A_INACT" data-valmsg-replace="true"></span> 
        </div>

        <div class="editor-label">
         <label for="A_NAME">RE NAME</label> 
        </div>
        <div class="editor-field">
          <input class="form-control" data-val="true" data-val-length="The field RE NAME must be a string with a maximum length of 39." data-val-length-max="39" data-val-required="The RE NAME field is required." id="A_NAME" name="A_NAME" readonly="readonly" style="background:#f2f3f3" tabindex="6" title="This is the RE NAME." type="text" value="ZZ_TESTXDO THIS ZZXXXX" />
        </div>




        <p>
            <input type="submit" value="Save" />
        </p>
    </fieldset>
</form>
<div>
    <a href="/MTS_RENAME">Back to List</a>
</div>


            </section>
        </div>
        <footer>
            <div class="content-wrapper">
                <div class="float-left">
                    <p>&copy; 2017 - My ASP.NET MVC Application</p>
                </div>
            </div>
        </footer>

        <script src="/Scripts/jquery-1.7.1.js"></script>
<script src="/Scripts/jquery-2.1.4.js"></script>
<script src="/Scripts/jquery-migrate-1.2.1.js"></script>

        <script src="/bundles/bootstrap"></script>


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


    </body>
</html>

最佳答案

HTML 有一个类似这样的工具提示的 title 属性。 (对于比基本工具提示更复杂的任何东西，您将查看一些自定义样式和可能的 JavaScript 功能来模仿工具提示，具体取决于所采用的方法。谷歌为此提供了各种现成的解决方案。)

那么您在哪里设置自定义 HTML 属性:

htmlAttributes = new { tabindex = 1 }

您可以简单地为 title 添加一个:

htmlAttributes = new { tabindex = 1, title = "Enter an I to Inactivate a record" }

关于c# - MVC Razor EditorFor Display Field help 当鼠标悬停在字段 aka 工具提示上时，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/47203361/

25 4 0
文章推荐： PHP 如果日期早于 X 天
文章推荐： python - 如何检查查询集是否为空？
文章推荐： dropdown - 如何在其父组件挂载时拥有语义 UI React Dropdown 自动对焦？
文章推荐： hex - 如何表示负的十六进制数？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com