Как отобразить некоторые вещи на той же странице вместо перенаправления на другую страницу при нажатии подменю меню asp:?

Я использую asp: меню. Мой код aspx:

<body>
    <form id="form1" runat="server">
    <div>
        <asp:Menu ID="Menu_Library" runat="server">
        </asp:Menu>

    </div>
    </form>
</body>

Я генерирую элементы подменю (то есть) дочерние элементы динамически. Если я щелкаю элементы подменю, он перенаправляет меня на страницу, которую я определяю в своем коде, как это,

MenuItem childItem = new MenuItem();
childItem.NavigateUrl = "OtherPage.aspx";

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

Как этого добиться? Пожалуйста, помогите мне.. Это может быть либо в javascript, либо в коде позади.. Я не хочу, чтобы он переместился на другую страницу, вместо этого выполните действие на той же странице..

3 ответа

Решение

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

Ваш код:

MenuItem childItem = new MenuItem();
childItem.NavigateUrl = "OtherPage.aspx";

Изменить с:

MenuItem childItem = new MenuItem();
childItem.NavigateUrl = "javascript: return GoToSomeLink('"+ count +"');"; //You can pass parameters also

Функция Javascript:

<script type="text/javascript">
function GoToSomeLink(obj) //if parameters are used use them here also.
{
    var count=parseInt(obj); //use this count varible anywhere in the function
    $(#menuDiv).show(); /any div show or hide
    return false;

}
 </script>

Вы можете использовать методы jquery load () или ajax () для динамической загрузки содержимого без обновления страницы.

ИЛИ вы можете просто скрыть связанное содержимое встроенным и показать / скрыть их с помощью метода toggle()

Вы можете использовать метод jquery.load следующим образом

var a = this.find(".contentWrap"),
a.load(this.getTrigger().attr("href") + " .ajaxDiv");

Идея заключается в следующем

  1. Поместите любой класс CSS в каждое меню / подменю, в которое вы хотите загрузить другую страницу, скажем, ajaxMenu.
  2. установите URL-адрес меню / подменю через ваш код.
  3. создайте контейнер div на вашей странице мага с помощью css-class (conetntWrap)
  4. создайте контейнер div на каждой странице, которую вы хотите загрузить, скажем.ajaxDiv. Это важно, потому что он не будет загружать _viewstate на вашу страницу.
  5. Теперь напишите функцию на document.ready, как следует

    $(document).ready(function () 
    {
        $("a.ajaxMenu").live("click", function (a)
        {
            var a = this.find(".contentWrap"),
            a.load(this.getTrigger().attr("href") + " .ajaxDiv");
         });
     )};
    

    *--- использовать классы на asp.net *

    <asp:Menu ID="NavigationMenu" 
         StaticMenuStyle-CssClass="StaticMenuStyle"
         StaticMenuItemStyle-CssClass="StaticMenuItemStyle"
         StaticSelectedStyle-CssClass="StaticSelectedStyle"
         StaticHoverStyle-CssClass="StaticHoverStyle"
        runat="server">
    </asp:Menu>
    

    Вышеуказанный способ добавить CSS CLASS.

Другие вопросы по тегам