jQWidgets Forums

jQuery UI Widgets Forums Grid selectionmode: 'checkbox'

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

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
  • selectionmode: 'checkbox' #47650

    morgenweck
    Participant

    Is there a reason that if I use selectionmode: ‘checkbox’, and set the ID that it displays properly in IE 10 but not at all in Firefox 25.0.1 or Chrome Version 31.0.1650.63 ?

    I don’t see any errors.

    Thanks

    selectionmode: 'checkbox' #47656

    Dimitar
    Participant

    Hello morgenweck,

    Please post a sample code, which we can test locally to determine the source of the issue. Remember to format your code by selecting it and clicking the code button from the toolbar.

    Best Regards,
    Dimitar

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

    selectionmode: 'checkbox' #47683

    morgenweck
    Participant
        function LoadCodeGrid1() {
            $("#CodeGrid1").jqxGrid('clearselection');
            var t = document.getElementById('txtCode').value;
            var theme = getDemoTheme();
            var dbid = "0";
            var length = 15;
    
            $.ajax({
                type: "POST",
                url: "JSONService.asmx/Lucene_Index_Search",
                data: "{'t':'" + t + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                beforeSend: function () {
                },
                success: function (data) {
                    jQuery("#Text3").val(data.d);
                    var source =
                     {
                         datatype: "json",
                         datafields: [
                          { name: "Samples", type: 'string' },
                          { name: "ICD9_Code", type: 'string' },
                          { name: "text", type: 'string' },
                          { name: "Score", type: 'string' }
                         ],
                         id: "ID",
                         localdata: data.d
                     };
                    var theme = getDemoTheme();
                    var dataAdapter = new $.jqx.dataAdapter(source);
    
                    var dataAdapter = new $.jqx.dataAdapter(source, {
                        loadComplete: function () {
                            length = dataAdapter.records.length;
                            jQuery("#Text3").val(length);
                        }
                    }
                    );
    
                    var role = sessionStorage.getItem("role");
    
                    $("#CodeGrid1").jqxGrid(
                    {
                        width: "100%",
                     
                        autoheight: true,
                        autorowheight: true,
                        source: dataAdapter,
                        theme: theme,
                        pageable: true,
                        pagesize: 5,
                     
    
                        enablebrowserselection: true,
                                     editable: true,
                                       selectionmode: 'checkbox',
                                         sortable: true,
                        filterable: true,
                        columns: [                                            
                                 { datafield: "ICD9_Code", text: "ICD-9 Code", width: 100, editable: false },
                                 { datafield: "Samples", text: "Samples", width: 100, editable: false },
                                 { datafield: "Score", text: "Relevance", width: 75, editable: false },
                                 { datafield: "text", text: "Description", editable: false }
    
                        ]
                    });
                      $('#CodeGrid1').on('rowdoubleclick', function (event) {
    
                    });
    
                },
                error: function (e) {
                    alert("error: subgridCode");
                }
    
            });
    
            $("#loading").ajaxStop(function () {
                $(this).hide();
            });
        }
    
    selectionmode: 'checkbox' #47686

    Dimitar
    Participant

    Hi morgenweck,

    The provided code is insufficient for us to reproduce the reported issue. Please make sure that the “ID” datafield has unique values and that you are using the latest version of jQWidgets (3.1.0).

    Best Regards,
    Dimitar

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

    selectionmode: 'checkbox' #47716

    morgenweck
    Participant

    [{"ID":"1","Samples":"Yes","ICD9_Code":"1420","text":"<b>Short Description:</b><br/> Malig neo parotid<br/><b>Description:</b><br/> Malignant neoplasm of parotid gland Hollings: (1741)","Score":"1.355216"},{"ID":"2","Samples":"Yes","ICD9_Code":"1421","text":"<b>Short Description:</b><br/> Malig neo submandibular<br/><b>Description:</b><br/> Malignant neoplasm of submandibular gland Hollings: (118)","Score":"1.355216"}]

    This is some sample data. The ID is generated by code when the data is looped to produce the JSON i = i + 1 on each loop

    Thanks for your help.

    Using 3.1.0

    selectionmode: 'checkbox' #47725

    Peter Stoev
    Keymaster

    Hi morgenweck,

    I would like to help with that one and I prepared for you a working sample:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <title id='Description'>This example illustrates Rows Selection with a Checkbox.
        </title>
        <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
        <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/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.sort.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxgrid.filter.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxgrid.pager.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxgrid.edit.js"></script>
       <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> 
        <script type="text/javascript" src="../../jqwidgets/jqxpanel.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
        <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script>
        <script type="text/javascript" src="../../scripts/demos.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {       
                var source =
                           {
                               datatype: "json",
                               datafields: [
                                { name: "Samples", type: 'string' },
                                { name: "ICD9_Code", type: 'string' },
                                { name: "text", type: 'string' },
                                { name: "Score", type: 'string' }
                               ],
                               id: "ID",
                               localdata: [{ "ID": "1", "Samples": "Yes", "ICD9_Code": "1420", "text": "<b>Short Description:</b><br/> Malig neo parotid<br/><b>Description:</b><br/> Malignant neoplasm of parotid gland Hollings: (1741)", "Score": "1.355216" }, { "ID": "2", "Samples": "Yes", "ICD9_Code": "1421", "text": "<b>Short Description:</b><br/> Malig neo submandibular<br/><b>Description:</b><br/> Malignant neoplasm of submandibular gland Hollings: (118)", "Score": "1.355216" }]
                           };
                var theme = "";
                var dataAdapter = new $.jqx.dataAdapter(source);
    
                $("#CodeGrid1").jqxGrid(
                {
                    width: "100%",
    
                    autoheight: true,
                    autorowheight: true,
                    source: dataAdapter,
                    pageable: true,
                    pagesize: 5,
                    enablebrowserselection: true,
                    editable: true,
                    selectionmode: 'checkbox',
                    sortable: true,
                    filterable: true,
                    columns: [
                             { datafield: "ICD9_Code", text: "ICD-9 Code", width: 100, editable: false },
                             { datafield: "Samples", text: "Samples", width: 100, editable: false },
                             { datafield: "Score", text: "Relevance", width: 75, editable: false },
                             { datafield: "text", text: "Description", editable: false }
    
                    ]
                });
            });
        </script>
    </head>
    <body class='default'>
        <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
            <div id="CodeGrid1">
            </div>
        </div>
    </body>
    </html>
    

    I have tested the above code with IE, Chrome and Firefox and it works correctly. As I do not know whether all references to our files are included correctly on your side, I suggest you to check that.

    Best Regards,
    Peter Stoev

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

    selectionmode: 'checkbox' #47729

    morgenweck
    Participant

    I’ll try making this on a new page with only this code and see what happens.

    Thanks for your help I’ll let you know how I make out.

    Bill

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

You must be logged in to reply to this topic.