Изменить видимость ярлыка ASP.NET с помощью JavaScript

Question

У меня есть страница ASP.NET с невидимой кнопкой asp :. Я не могу сделать это видимым с помощью JavaScript, потому что он не отображается на странице.

Что я могу сделать, чтобы решить эту проблему?

Answer 1

Если вам нужно манипулировать им на стороне клиента, вы не можете использовать свойство Visible на стороне сервера. Вместо этого установите его стиль отображения CSS на «none». Например:

<asp:Label runat="server" id="Label1" style="display: none;" />

Затем вы можете сделать это видимым на стороне клиента с помощью:

document.getElementById('Label1').style.display = 'inherit';

Вы можете снова скрыть это с помощью:

document.getElementById('Label1').style.display = 'none';

Имейте в виду, что могут быть проблемы с ClientID более сложным, чем "Label1" на практике. Вам потребуется использовать ClientID с getElementById, а не ID на стороне сервера, если они различаются.

Answer 2

Попробуй это.

<asp:Button id="myButton" runat="server" style="display:none" Text="Click Me" />

<script type="text/javascript">
    function ShowButton() {
        var buttonID = '<%= myButton.ClientID %>';
        var button = document.getElementById(buttonID);
        if(button) { button.style.display = 'inherit'; }
    }
</script>

Не используйте серверный код для этого, потому что это потребует обратной передачи. Вместо использования Visibility = "false" вы можете просто установить свойство CSS, которое скрывает кнопку. Затем в javascript переключите это свойство обратно всякий раз, когда вы захотите снова показать кнопку.

ClientID используется, поскольку он может отличаться от идентификатора сервера, если кнопка находится внутри элемента управления Naming Container. К ним относятся панели различных видов.

Answer 3

Продолжая то, что Дейв Уорд сказал:

• Нельзя установить для свойства Visible значение false, поскольку элемент управления не будет отображаться.
• Вы должны использовать свойство Style , чтобы установить display в none .

---

Страница / Управление дизайном

<asp:Label runat="server" ID="Label1" Style="display: none;" />

<asp:Button runat="server" ID="Button1" />

---

Код позади

Где-то в разделе загрузки:

Label label1 = (Label)FindControl("Label1");
((Label)FindControl("Button1")).OnClientClick = "ToggleVisibility('" + label1.ClientID + "')";

---

Файл Javascript

function ToggleVisibility(elementID)
{
    var element = document.getElementByID(elementID);

    if (element.style.display = 'none')
    {
        element.style.display = 'inherit';
    }
    else
    {
        element.style.display = 'none';
    }
}

---

Конечно, если вы хотите не переключаться, а просто показывать кнопку / метку, то соответствующим образом измените метод javascript.

Важным моментом здесь является то, что вам необходимо отправить информацию о ClientID элемента управления, которым вы хотите манипулировать на стороне клиента, в файл javascript либо путем установки глобальных переменных, либо через параметр функции, как в моем примере.

Answer 4

Вы должны быть осторожны с XSS , когда делаете такие вещи:

document.getElementById('<%= Label1.ClientID %>').style.display

Скорее всего, никто не сможет вмешаться в ClientID Label1 в этом случае, но просто чтобы быть в безопасности, вы можете захотеть передать его значение через одну из библиотек AntiXss методы:

document.getElementById('<%= AntiXss.JavaScriptEncode(Label1.ClientID) %>').style.display

Answer 5

Это самый простой способ, который я нашел:

        BtnUpload.Style.Add("display", "none");
        FileUploader.Style.Add("display", "none");
        BtnAccept.Style.Add("display", "inherit");
        BtnClear.Style.Add("display", "inherit");

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

Answer 6

Убедитесь, что для свойства Visible установлено значение true, иначе элемент управления не будет отображаться на странице. Затем вы можете использовать скрипт для управления им.

Answer 7

Если вы подождете, пока страница загрузится, а затем установите отображение кнопки на none, это должно сработать. Затем вы можете сделать это видимым позже.