jQWidgets Forums

Forum Replies Created

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • October 29, 2013 at 12:19 pm in reply to: Problem with horizontal scrollbar Problem with horizontal scrollbar #31532

    sobhanattar
    Member

    Hi
    This is my complete code which is come from one of your own examples. As you see in this image, when the width is 640 the behavior of scroll bar and grid is not as it should. For example the grid show only 5 columns while I have 6 columns. Another thing is that you can’t see no data label until you scroll and then it appears

    here is my complete code

    <!DOCTYPE html>
    <html lang="fa">
    <head>
    <link rel="stylesheet" type="text/css" href="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/styles/jqx.bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/styles/jqx.base.css" />
    	
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jquery-1.10.1.min.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxgrid.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/globalization/globalize.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/globalization/globalize.culture.fa-IR.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxgrid.sort.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxgrid.filter.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxgrid.pager.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxgrid.selection.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxgrid.columnsresize.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxdata.export.js"></script>
    <script type="text/javascript" src="http://localhost/sarir/s3/application/plugins/jqwidgets/jqwidgets/jqxgrid.export.js"></script>
    <script type="text/javascript">
    $(document).ready(function () {
    			var source = {
    							datatype: "json",
    							datafields: [
    											{ name: 'ShippedDate' },
    											{ name: 'Freight' },
    											{ name: 'ShipName' },
    											{ name: 'ShipAddress'},
    											{ name: 'ShipCity'},
    											{ name: 'ShipCountry'}
    										],
    							};
    			$("#grid").jqxGrid({
    									source: source,
    									//theme: 'bootstrap',
    									width: 640,
    									height: 450,
    									//scrollmode: 'logical',
    									//rowsheight: 35,
    									//columnsheight: 35,
    									//rtl: true,
    									//altrows: true,
    									//showdefaultloadelement: false,
    									//columnsresize: true,
    									//sortable: true,
    									//filterable: true,
    									columns: [
    												  { text: 'Ship Name',  datafield: 'ShipName', width: 250},
    												  { text: 'Shipped Date', datafield: 'ShippedDate', width: 250},
    												  { text: 'Freight', datafield: 'Freight', width: 250},
    												  { text: 'Ship Address', datafield: 'ShipAddress', width: 50},
    												  { text: 'Ship City', datafield: 'ShipCity', width: 50},
    												  { text: 'Ship Country', datafield: 'ShipCountry', width: 50}
    											]
    								});
    			
            });
    </script>
    </head>
    <body class='default'>
            <div style="float: left;" id="grid">
    		</div>
    </body>
    </html>

    Thanks in advance

    October 29, 2013 at 11:08 am in reply to: Problem with horizontal scrollbar Problem with horizontal scrollbar #31526

    sobhanattar
    Member

    Hi,
    I’m using the latest version,
    As this issue is really preventing us from using jqwidgets, please let me know what other information is required so I provide them for you to solve the issue.

    Thanks in advance

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)