jQWidgets Forums

Forum Replies Created

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

Author

Posts

April 29, 2014 at 9:31 am in reply to: Combobox integration to Grid Combobox integration to Grid #53704

fox82i

Participant

Yes I take this way: dispaly the two values using the renderer callback fucntion..
Thanks Dimitar

April 29, 2014 at 6:55 am in reply to: Combobox integration to Grid Combobox integration to Grid #53687

fox82i

Participant

in my case I have to give the possibility to search for a value or by its synonym, or by the value itself.
For example, if I want to find the value of id_RS I can do it or by typing the value id_RS, or by a value called snp_name_lab.
The two values, id_RS and snp_name_lab, are tied together in a mysql table.
For this reason, I wanted to have a grid inside a combobox, in such way I give the possibility to the user to immediately see both values

April 29, 2014 at 6:47 am in reply to: Combobox integration to Grid Combobox integration to Grid #53686

fox82i

Participant

I know there is a possibility to have a combobox inside a grid, but is not that I want
Thanks

April 24, 2014 at 11:36 am in reply to: Open dynamic tabs from jqxnavigationbar Open dynamic tabs from jqxnavigationbar #53538

fox82i

Participant

Ok ok.. I need a vacation!
Thanks Dimitar….

April 23, 2014 at 10:44 am in reply to: Open dynamic tabs from jqxnavigationbar Open dynamic tabs from jqxnavigationbar #53474

fox82i

Participant

Thank Dimitar,
I noticed the loadPage function.

Now I start to write a page to load a grid.. I take and example, in this forums, to load dynamic content (http://www.jqwidgets.com/community/topic/dynamic-contents/) and I try to copy the solution.
For ex.
I made the page “visualizza_polimorfismi.php” whith this code:


<!DOCTYPE html>
<html lang="en">
<head>
<script type="text/javascript">
		  $(document).ready(function () {
		                var source={
                        datatype: "json",
                        datafields: [
                            {name:'id_RS' ,type:'string'},
                            {name:'snp_name_lab' ,type:'string'},
                            {name:'update_date' ,type:'date'},
                            {name:'chromosome' ,type:'string'},
                            {name:'chr_position' ,type:'string'},
                            {name:'RefSNP_alleles' ,type:'text'},
                            {name:'dbsnp_build' ,type:'string'},
                            {name:'note' ,type:'string'},
                            {name:'allele1' ,type:'string'},
                            {name:'allele2' ,type:'string'},
                            {name:'Note_for_genotype_input' ,type:'string'},
                            {name:'Location_or_Amminoacid_change' ,type:'string'},
                            {name:'Sequenza_context' ,type:'string'}
                           
                            ],
                        id:'id_RS',
                        root: 'rows',
                        url:'controller/enumerate_snps.php',

                        filter: function(){
                          // update the grid and send a request to the server.
                          $("#snps").jqxGrid('updatebounddata', 'filter');
                        },
                        sort: function(){
                          // update the grid and send a request to the server.
                          $("#snps").jqxGrid('updatebounddata', 'sort');
                        },
                       
                        beforeprocessing: function(data){   
                          if (data != null){
                           source.totalrecords = data.total;          
                           
                          }
                        }
                    };                
                    var dataAdapter = new $.jqx.dataAdapter(source, {
                                        downloadComplete: function (data, status, xhr) { },
                                        loadComplete: function (data) { },
                                        loadError: function (xhr, status, error) { }
                                    });
            
                    $("#snps").jqxGrid(
                        {
                            width: '1380',
                            source: dataAdapter,   
                            filterable: true,             
                            pageable: true,
                            autoheight: true,
                            sortable: true,
                            columnsresize: true,
      			    autoshowfiltericon: false,
                            rendergridrows: function(obj){
                                 return obj.data;    
                            },
                            
                            columns: [
                              { text: 'id_RS',  datafield: 'id_RS', width: '250' },
                              { text: 'snp name lab',  datafield: 'snp_name_lab', width: 250 },
                              { text: 'Update date',  datafield: 'update_date',cellsformat: 'yyyy-MM-dd', width: 250 },
                              { text: 'Chromosome',  datafield: 'chromosome', width: 250 },
                              { text: 'chr position',  datafield: 'chr_position', width: 250 },
                              { text: 'RefSNP alleles',  datafield: 'RefSNP_alleles', width: 250 },
                              { text: 'dbsnp build',  datafield: 'dbsnp_build', width: 250 },
                              { text: 'note',  datafield: 'note', width: 250 },
                              { text: 'allele1',  datafield: 'allele1', width: 250 },
                              { text: 'allele2',  datafield: 'allele2', width: 250 },
                              { text: 'Note for genotype input',  datafield: 'Note_for_genotype_input', width: 250 },
                              { text: 'Location or Amminoacid change',  datafield: 'Location_or_Amminoacid_change', width: 250 },
                              { text: 'Sequence context',  datafield: 'Sequenza_context', width: 250 },
                              
                              
                            ]
                        });

        						$("#button").click(function () {
        						    $("#snps").jqxGrid('autoresizecolumns');
        						 });

						        $("#snps").jqxGrid('autoresizecolumns');

        						$('#clearfilteringbutton').click(function () {
                      				  $("#snps").jqxGrid('clearfilters');
                 		});

						        $("#excelExport").click(function () {
            			     $("#snps").jqxGrid('exportdata', 'xls', 'snps_fsc');           
           				  });

            			  $("#xmlExport").click(function () {
                			$("#snps").jqxGrid('exportdata', 'xml', 'snps_fsc');
            			  });

            			  $("#print").jqxButton();
         
			              $("#print").click(function () {
			                var gridContent = $("#snps").jqxGrid('exportdata', 'html');
			                var newWindow = window.open('', '', 'width=800, height=500'),
			                document = newWindow.document.open(),
			                pageContent =
			                    '<!DOCTYPE html>\n' +
			                    '<html>\n' +
			                    '<head>\n' +
			                    '<meta charset="utf-8" />\n' +
			                    '<title>Snps FSC</title>\n' +
			                    '</head>\n' +
			                    '<body>\n' + gridContent + '\n</body>\n</html>';
			                document.write(pageContent);
			                document.close();
			                newWindow.print();
			              });
	    });
</script>
</head>
<body class='default'>
<div id='content'>	
<div id='jqxWidget' style="margin-top:10px; margin-left:10px;font-size: 13px; font-family: Verdana; float: left;margin-left:10px">
	<div style='margin-top: 5px;'>
		<div style='float: left;'>
				<input id="button" type="button" value="Auto Resize Columns" />
				<input value="Remove Filter" id="clearfilteringbutton" type="button" />
                <input type="button" value="Export to Excel" id='excelExport' />
                
                <input type="button" value="Export to XML" id='xmlExport' />
                <input type="button" value="Print" id='print' />
    	</div>
    	<br /><br />
		
	
	</div>
	<div id="snps" ></div>
	</div>
</div>
</body>
  <!---->
</html>

if I want to open the first link “SNPs table”, the tab open but i see only the buttons…
If I copy the js code ,of jqxgrid , in the chrome console then I can see the grid..

In the main file, “index.php”, I added the link of jqxgrid


<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxsplitter.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxnavigationbar.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxtabs.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.js"></script>
    
    <script type="text/javascript" src="js/jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxmenu.js"></script>

    <script type="text/javascript" src="js/jqwidgets/jqxgrid.selection.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.pager.js"></script>
    <script type="text/javascript" src="js/jqwidgets/jqxdata.export.js"></script> 
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.export.js"></script> 
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.filter.js"></script> 
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.sort.js"></script> 
    <script type="text/javascript" src="js/jqwidgets/jqxgrid.columnsresize.js"></script> 
 
    <script type="text/javascript" src="js/bootstrap/bootstrap.min.js"></script>

Where I wrong?

April 14, 2014 at 3:12 pm in reply to: Open dynamic tabs from jqxnavigationbar Open dynamic tabs from jqxnavigationbar #53060

fox82i

Participant

The load page funtion is


 function loadPage(url) {
            $.get(url, function (data) {
               // $('#content').text(data);
                var tmp = $('<div></div>').html(data);
                var pippo=tmp.find('#content').html();
                return pippo;                    
            });
        }

April 14, 2014 at 12:42 pm in reply to: Prevent tab close Prevent tab close #53050

fox82i

Participant

Flevi,
wait me I come from other framework and I discovered this recently.
I need to study before to produce somenthing

April 14, 2014 at 9:19 am in reply to: Prevent tab close Prevent tab close #53033

fox82i

Participant

Hi flevi,
I’ve similar problem… I suggest to you to implemente a javascript function to prevent this kind of problem..

Author

Posts

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