jQWidgets Forums

jQuery UI Widgets Forums Grid grid without selectable row

Tagged: , ,

This topic contains 3 replies, has 2 voices, and was last updated by  Peter Stoev 11 years, 6 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • grid without selectable row #46716

    al3dv
    Participant

    Hi All, I have a problem, only in IE 8.

    I see the grid with all data right, but I am not able to select the row.

    This issue is present only when I use IE.

    below my test-page.

    —————————-
    <!DOCTYPE html>
    <html lang=”en”>
    <head>
    <meta name=”keywords” content=”jQuery Accordion, Expander, Toggle Bar, Expander Bar, Navigation Bar, Accordion, jqxNavigationBar, jqxExpander” />
    <meta name=”description” content=”jqxExpander is a simple and easy to use widget that shows/hides
    an element. It supports several built-in expand modes. You can set it up to show
    or hide an element after a click, double-click or mouse enter event on the expander’s
    header. This widget also comes with customizable slide and fade animations.” />
    <title id=’Description’>jqxExpander is a simple and easy to use widget that shows/hides
    an element. It supports several built-in expand modes. You can set it up to show
    or hide an element after a click, double-click or mouse enter event on the expander’s
    header. This widget also comes with customizable slide and fade animations.
    </title>
    <link rel=”stylesheet” href=”../../jqwidgets/styles/jqx.base.css” type=”text/css” />
    <script type=”text/javascript” src=”../../scripts/gettheme.js”></script>
    <script type=”text/javascript” src=”../../scripts/jquery-1.10.2.min.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxcore.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxexpander.js”></script>

    <script type=”text/javascript” src=”../../jqwidgets/jqxdata.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxbuttons.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxscrollbar.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxmenu.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxgrid.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxgrid.selection.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxexpander.js”></script>
    <script type=”text/javascript” src=”../../scripts/gettheme.js”></script>
    <script type=”text/javascript” src=”generatedata.js”></script>

    <style>
    html, body{width:99.5%; height:60%;overflow: auto};
    //overflow: auto; overflow-x: hidden;}
    </style>

    <script type=”text/javascript”>
    $(document).ready(function () {
    // Create jqxExpander
    var theme = “”;
    $(“#jqxExpander”).jqxExpander({ width: ‘98%’, theme: theme });
    $(“#jqxExpander2”).jqxExpander({ width: ‘98%’, theme: theme });

    var data = generatedata(2500);

    var source =
    {
    localdata: data,
    datafields:
    [
    { name: ‘firstname’, type: ‘string’ },
    { name: ‘lastname’, type: ‘string’ },
    { name: ‘productname’, type: ‘string’ },
    { name: ‘quantity’, type: ‘number’ },
    { name: ‘price’, type: ‘number’ },
    { name: ‘total’, type: ‘number’ }
    ],
    datatype: “array”
    };
    var adapter = new $.jqx.dataAdapter(source);

    $(“#jqxgrid”).jqxGrid(
    {
    width: ‘99%’,
    source: adapter,
    theme: theme,
    scrollmode: ‘deferred’,
    deferreddatafields: [‘firstname’, ‘lastname’, ‘productname’],
    columns: [
    { text: ‘First Name’, datafield: ‘firstname’, width: 100 },
    { text: ‘Last Name’, datafield: ‘lastname’, width: 100 },
    { text: ‘Product’, datafield: ‘productname’, width: 180 },
    { text: ‘Quantity’, datafield: ‘quantity’, width: 80, cellsalign: ‘right’ },
    { text: ‘Unit Price’, datafield: ‘price’, width: 80, cellsalign: ‘right’, cellsformat: ‘c2’ },
    { text: ‘Total’, datafield: ‘total’, cellsalign: ‘right’, cellsformat: ‘c2′ }
    ]
    });

    });
    </script>
    </head>
    <body class=’default’>
    <div id=’jqxWidget’ style=”background-color:red”>
    <div id=’jqxExpander’>
    <div>
    Early History of the Internet</div>
    <div>

    • 1961 First packet-switching papers
    • 1966 Merit Network founded
    • 1966 ARPANET planning starts
    • 1969 ARPANET carries its first packets
    • 1970 Mark I network at NPL (UK)
    • 1970 Network Information Center (NIC)
    • 1971 Merit Network’s packet-switched network operational
    • 1971 Tymnet packet-switched network
    • 1972 Internet Assigned Numbers Authority (IANA) established
    • 1973 CYCLADES network demonstrated
    • 1974 Telenet packet-switched network
    • 1976 X.25 protocol approved
    • 1979 Internet Activities Board (IAB)
    • 1980 USENET news using UUCP
    • 1980 Ethernet standard introduced
    • 1981 BITNET established

    </div>
    </div>
    </br>
    <div id=’jqxExpander2′>
    <div>
    Early History of the Internet</div>
    <div>

    • 1961 First packet-switching papers
    • 1966 Merit Network founded
    • 1966 ARPANET planning starts
    • 1969 ARPANET carries its first packets
    • 1970 Mark I network at NPL (UK)
    • 1970 Network Information Center (NIC)
    • 1971 Merit Network’s packet-switched network operational
    • 1971 Tymnet packet-switched network
    • 1972 Internet Assigned Numbers Authority (IANA) established
    • 1973 CYCLADES network demonstrated
    • 1974 Telenet packet-switched network
    • 1976 X.25 protocol approved
    • 1979 Internet Activities Board (IAB)
    • 1980 USENET news using UUCP
    • 1980 Ethernet standard introduced
    • 1981 BITNET established

    </div>
    </div>
    </br>
    <div id=”jqxgrid”></div>
    </div>
    </body>
    </html>

    —————————-
    ps sorry for my english

    grid without selectable row #46724

    Peter Stoev
    Keymaster

    Hi al3dv,

    Please, look at this sample – http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/deferredscrolling.htm. It is with deferred scrolling and you can run it under IE8. All rows are selectable.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

    grid without selectable row #46741

    al3dv
    Participant

    I tried also to insert this example in my page, but the result is the same: I’m not able to select any row.

    I think that is a resize problem, my page is loaded inside an iframe with a fix size and my page show with scrollbar.

    No one have problem with small page e slection row grid?

    I have this problem only with IE8, in Firefox it work fine.

    Thanks in advance

    grid without selectable row #46748

    Peter Stoev
    Keymaster

    Hi al3dv,

    Please, provide us a full sample and format the code by using the editor’s “code” button so we would be able to test your code locally. At present, we cannot reproduce such behavior.

    Best Regards,
    Peter Stoev

    jQWidgets Team
    http://www.jqwidgets.com/

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.