Visible/Invisible Grid????

6 posts, 0 answers
  1. Saad
    Saad avatar
    82 posts
    Member since:
    Oct 2008

    Posted 09 Dec 2008 Link to this post

    I have become fed up of this javascript....i am writting a code which makes my three radgrids visible and invisible. One grid will be visible at a time.....i am doing this when radToolBarButton is clicked OnClientButtonClicked="OnMenuButtonClicked".
    I have set Radgrid_NoteBook initially to visible=true and other two are false..

    Here`s my javascript code:

    function

    OnMenuButtonClicked(sender, args)

     

    {

    if(args.get_item().get_text() == "Friends")

     

    {alert(args.get_item().get_text());

    $find(

    "<%=RadGrid_Friends.ClientID %>").get_element().style.display = "";

     

    $find(

    "<%=RadGrid_Networks.ClientID %>").get_element().style.display = "none";

     

    $find(

    "<%=RadGrid_NoteBook.ClientID %>").get_element().style.display = "none";

     

    }

     

    else if(args.get_item().get_text() == "Networks")

     

    {alert(args.get_item().get_text());

    $find(

    "<%=RadGrid_Friends.ClientID %>").get_element().style.display = "none";

     

    $find(

    "<%=RadGrid_Networks.ClientID %>").get_element().style.display = "";

     

    $find(

    "<%=RadGrid_NoteBook.ClientID %>").get_element().style.display = "none";

     

    }

     

    else if(args.get_item().get_text() == "NoteBook")

     

    {alert(args.get_item().get_text());

    $find(

    "<%=RadGrid_Friends.ClientID %>").get_element().style.display = "none";

     

    $find(

    "<%=RadGrid_Networks.ClientID %>").get_element().style.display = "none";

     

    $find(

    "<%=RadGrid_NoteBook.ClientID %>").get_element().style.display = "";

     

    }

    }

  2. Dimo
    Admin
    Dimo avatar
    8332 posts

    Posted 10 Dec 2008 Link to this post

    Hi saadi,

    I am not sure I understand you correctly - is there a problem with the provided Javascript code or you simply want to optimize/remove it?

    If you want to remove it, please try using RadTabStrip + RadMultiPage:

    http://demos.telerik.com/aspnet-ajax/TabStrip/Examples/Functionality/Multipage/DefaultCS.aspx

    Each RadGrid will be placed in a separate page view.

    In case you want to optimize the Javascript, you can do the following:

    1) Wrap all three RadGrids in a single container, e.g. a <div>

    2) Assign a unique CssClass to each of the three RadGrids.

    3) Clicking on a RadToolBar button will set one of the three CSS classes to the RadGrids container.

    4) Depending on the container's CSS class, only one of the three RadGrids will be visible.


    Here is an example:


    HTML

    <div id="RadGridContainer" class="Notebook">
        <telerik:RadGrid CssClass="FriendsGrid" />
        <telerik:RadGrid CssClass="NetworksGrid" />
        <telerik:RadGrid CssClass="NotebookGrid" />
    </div>


    Javascript

    function OnMenuButtonClicked(sender, args)
    {
        $get("RadGridContainer").className = args.get_item().get_text();
    }


    CSS

    .Friends .RadGrid,
    .Networks .RadGrid,
    .Notebook .RadGrid
    {
        display: none;
    }

    .Friends .FriendsGrid,
    .Networks .NetworksGrid,
    .Notebook .NotebookGrid
    {
        display: block;
    }



    I guess this is a lot better than using a bulk of Javascript. $get is a short form of document.getElementById() in MS AJAX enabled websites.


    Kind regards,
    Dimo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Saad
    Saad avatar
    82 posts
    Member since:
    Oct 2008

    Posted 10 Dec 2008 Link to this post

    NOTHING has happened man....
    There isn`t a single change in the condiiton. I did the same as u told me.
    First i used radToolStrip with multiPages but that was not working on mozilla firefox!
    PLEASE help me! PLEASE
  5. Dimo
    Admin
    Dimo avatar
    8332 posts

    Posted 10 Dec 2008 Link to this post

    Hi saadi,

    Please send us a runnable example of what you are trying to do and I will tell you how to proceed.

    Kind regards,
    Dimo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  6. Saad
    Saad avatar
    82 posts
    Member since:
    Oct 2008

    Posted 10 Dec 2008 Link to this post

    Now i am using radTabStrip again for this....so for now its ok. But tell me that the changing of the pageViews using radTabStrip is on the client side or server?
  7. Dimo
    Admin
    Dimo avatar
    8332 posts

    Posted 10 Dec 2008 Link to this post

    Hi saadi,

    RadMultiPage supports both modes, it depends on the RenderSelectedPageOnly property. By default this is set to False, so all page views are rendered as in the online demo, provided in my previous post.

    Best wishes,
    Dimo
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017