MVC - OnMouseOver в строке таблицы основного вида, текстовые изменения в частичном представлении - PullRequest
Новая
       27

MVC - OnMouseOver в строке таблицы основного вида, текстовые изменения в частичном представлении

0 голосов
/ 15 ноября 2018

У меня есть несколько представлений, которые разделяют общее частичное представление, каждое с различным количеством таблиц и строк, содержащих разные элементы данных.Когда пользователь наводит указатель мыши на любую другую строку, мне бы хотелось, чтобы общий частичный вид отображал строку текста, относящуюся к ожидаемому типу данных этой строки, и исчезал, когда он находился вне этой строки.Ниже приведен пример основного вида с двумя примерами строк таблицы. 

<table>
<tr onmouseover="showDef(2)" onmouseout="showDef(0)">
    <td>
        <label for="TerminalID" class="formlabel"><label class="asterisk">*</label>Terminal ID:</label>
        @Html.TextBoxFor(model => Model.transactions.NGT_TERMINAL_ID, new { @class = "forminput", value = "", required = "required" })
    </td>
</tr>
<tr onmouseover="showDef(13)" onmouseout="showDef(0)">
    <td>
        <label for="Amount" class="formlabel"><label class="asterisk">*</label>Amount:</label>
        @Html.TextBoxFor(model => Model.transactions.NGT_AMOUNT, new { @class = "forminput", maxlength = "9", type = "number", onblur = "Validate(id); GetAmounts(id, 'tipamt')", id = "amt", required = "required" })
    </td>
</tr></table>

На этом этапе моя предыдущая настройка работала при использовании iFrames для основного и частичного представления, от которого я удаляюсь.Прежде чем кто-либо предложит просто использовать всплывающую подсказку для каждой строки, существует примерно 64 вида, в каждом из которых по меньшей мере дюжина строк, некоторые - до тридцати, и время от времени описания меняются немного, поэтому изменение 60 всплывающих подсказок по одной не являетсяточно идеально.Ниже приведен текущий javascript, инициирующий изменение текста, а под ним - целевой iframe (частичное представление), а после этого - помощь CSS.

Javascript: 

function showDef(t) {
        top.sideframe.activeDef.style.visibility = "hidden";
        top.sideframe.activeDef = top.sideframe.document.getElementById("def" + t);
        top.sideframe.activeDef.style.visibility = "visible";
    }

target iFrame (частичное представление)сейчас): 

<label id="def0" class="def"></label>
<label id="def2" class="def">Terminal Identification number</label>
<label id="def13" class="def">Amount of stuff</label>

CSS: 

.def {
    position: absolute;
    visibility: hidden;
    left: 10px;
    top: 4%; /*  text position from top of screen*/
    width: 97%;
    color: #FE0101; /* text  */
    margin-top: 20px;
    background: #eef1f6; /* body */
}

Любое направление высоко ценится.

...