mygrid.getSelectedId() returns null value?

adaptive · August 25, 2012, 2:39pm

Hi,

I am having a problem with mygrid.getSelectedId() and getSelectedRowId() they are both returning null. I am using the code for deleting a row but can’t because of the returned null value.

My Grid.js

$('#delete_button').live('click',function(){
  			removeRow();
  			alert(mygrid.getSelectedId());
  		});
 
$('#add_button').live('click', function(){
  			addRow();
  		});
  		
 $('#clients').live('click', function(){
   	 	mygrid = new dhtmlXGridObject('gridbox');
		mygrid.setImagePath("dhtmlxSuite/dhtmlxGrid/codebase/imgs/");
		mygrid.setHeader('<h2 style="text-align:center;">Name</h2>,<h2  style="text-align:center;">Addess</h2>,<h2  style="text-align:center;">Town</h2>,<h2  style="text-align:center;">Phone</h2>,<h2 style="text-align:center;">Email</h2>,<h2 style="text-align:center;">User Name</h2>,<h2  style="text-align:center;">Password</h2>');

		mygrid.setInitWidths("120,153,100,100,117,140,120");
		mygrid.setColAlign("left,left, left,center,right,center,right");
		mygrid.setColTypes("ed,ed,ed,ed,ed,ed,ed");
  mygrid.setColSorting("db_connector,connector,connector,connector,connector,connector,connector,connector");
mygrid.setSkin("dhx_skyblue");
			mygrid.attachHeader('#connector_text_filter,#connector_text_filter,#connector_text_filter,,,<button  id="delete_button"  style="text-align:center; padding:20px; margin: 10px auto 0 auto;">Delete Client</button>,<button id="add_button"  style="padding: 10px;">Add Client</button>');

			mygrid.init(); //initialize grid
			mygrid.loadXML('db_connector.php'); //load data
  			var dp = new dataProcessor('db_connector.php');
			dp.init(mygrid);
			});
		
			function addRow(){
        			var newId = (new Date() ).valueOf();
       	 			mygrid.addRow(newId,"",mygrid.getRowsNum());
        			mygrid.selectRow(mygrid.getRowIndex(newId),false,false,true);
    			};
    			function removeRow(){
        			var selId = mygrid.getSelectedRowId();// mygrid.getSelectedId();
        			mygrid.deleteRow(selId);
    			};

Any thoughts. thanks…

cm1310 · August 27, 2012, 9:42am

You get null if now row(s) selected.

adaptive · August 27, 2012, 1:47pm

I select a row that gets highlighted and hit the delete button and it return null value checked it in the code getSelectedId() is returning null for some reason. Also tried getselectedRow() but same result.

Anyone know why?

thanks

sematik · August 27, 2012, 5:56pm

Unfortunately the issue cannot be reconstructed locally.
Your functions work well for us.
If issue still occurs for you - please, provide a more detailed sample or a demo-link where the issue can be reconstructed.

adaptive · August 27, 2012, 6:37pm

Ok here is my code.

index.php

<!DOCTYPE html> 
<html> 
	<head> 
	<title>Dashboard</title> 
	<meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
	<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
	
<style type="text/css">
	@import url(http://fonts.googleapis.com/css?family=Allura);
	@import url(http://fonts.googleapis.com/css?family=Arizonia);
	#logo {
		
		font-size: 1.9em
		font-family 'Arizonia', cursive;
		color: #9400D3; /*#68228B; /*#B23AEE; /*#8A2BE2; */
	}
	.splash {
		color: #fff;
	
	}
	html {
		width:240px;
		height:600px;
	}

</style>

</head> 
<body> 

<div data-role="page" data-theme="a" id="admin_page" >
	
	<link rel="stylesheet" type="text/css" href="dhtmlxSuite/dhtmlxGrid/codebase/dhtmlxgrid.css"/>
	<link rel="stylesheet" type="text/css" href="dhtmlxSuite/dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_blue.css">
	
    <script src="dhtmlxSuite/dhtmlxGrid/codebase/dhtmlxcommon.js"></script>
    <script src="dhtmlxSuite/dhtmlxGrid/codebase/dhtmlxgrid.js"></script>
    <script src="dhtmlxSuite/dhtmlxGrid/codebase/dhtmlxgridcell.js"></script>
    <script src="dhtmlxSuite/dhtmlxGrid/codebase/ext/dhtmlxgrid_filter.js"></script>
    
   <script src="codebase/dhtmlxdataprocessor.js" type="text/javascript"></script>
    <script src="codebase/connector.js" type="text/javascript"></script>
  <!--  <script src="codebase/dhtmlxdataprocessor_debug.js" type="text/javascript"></script>-->
    
<!--	<script src="dhtmlxSuite/dhtmlxDataProcessor/codebase/dhtmlxdataprocessor.js"></script>
	<script src="dhtmlxSuite/dhtmlxDataProcessor/codebase/dhtmlxdataprocessor_debug.js" type="text/javascript"></script> 
	<script src="dhtmlxSuite/dhtmlxConnector/php/codebase/connector.js" type="text/javascript"></script>-->
	<script type="text/javascript"  src="myGrid.js" type="text/javascript"></script>



	<div data-role="header"  data-position="fixed">
		<h1 style="font-size:1.5em; font-family:Georgia, sans-serif; ">Dashboard</h1>
		
		<div data-role="navbar" data-iconpos="right" >
			<ul>
				<li><a href="#" id="clients">Client List</a></li>
				<li><a href="#" id="register">Registration</a></li>
				<li><a href="#" id="product">Products</a></li>
				<li><a href="#" id="service">Services</a></li>
				<li><a href="#" id="schedual">My Schedual</a></li>
			</ul>
		</div>
	</div><!-- /header -->
	<div data-role="content" style="width: 100%; height: 100%; background-image: url('background_loxx.jpg'); repeat-x">
		<div style="background-color: #ddd; height: 960px; width: 960px; border: 5px solid #D8D7D5; border-radius: 10px; margin: 10px auto 20px auto;">
			<div id="gridbox" style="width:850px;height:500px;; margin: 20px auto 0 auto; color:#000"></div>
		</div>
	</div>

	
	<div data-role="footer" data-position="fixed"> 
		<a href="index.html"  class="ui-btn-left" data-theme="e">My Account</a>
		<h2>User: &nbsp;<span style="color: red">Lisa</span>&nbsp;&nbsp;&nbsp;Last login: &nbsp;<span style="color: green;">2:00pm Saturday May 5th 2012</span></h2>
		<a href="index.html"  class="ui-btn-right" data-theme="e">Logout</a>
		
	</div>
</div> <!-- /page -->
</body>
</html>

My grid.js

$( '#admin_page' ).live( 'pageinit',function(event){
  		
  		$('#delete_row').live('click',function(deleteRow){
  			var selId = mygrid.getSelectedRowId();// mygrid.getSelectedId();
        		mygrid.deleteRow(selId);
  		});
  		
  		$('#add_user').live('click', function(){
  			var newId = (new Date() ).valueOf();
       	 	mygrid.addRow(newId,"***,***,***,***,***,***,***,***",mygrid.getRowsNum());
        		mygrid.selectRow(mygrid.getRowIndex(newId),false,false,true);
  		});
  		
  		$('#clients').live('click', function(){
   	 		mygrid = new dhtmlXGridObject('gridbox');
			mygrid.setImagePath("dhtmlxSuite/dhtmlxGrid/codebase/imgs/");//path to images required by grid
			mygrid.setHeader('<h2 style="text-align:center;">Name</h2>,<h2  style="text-align:center;">Addess</h2>,<h2  style="text-align:center;">Town</h2>,<h2  style="text-align:center;">Phone</h2>,<h2>Cell</h2>,<h2 style="text-align:center;">Email</h2>,<h2 style="text-align:center;">User Name</h2>,<h2  style="text-align:center;">Password</h2>,<h2>Contact Pref</h2>,<h2>Smart Phone</h2>');
			mygrid.setInitWidths("120,153,100,100,117,140,120,100,100,100");//set column width in px
			mygrid.setColAlign("left,left, left,center,right,center,right,right,center,right");//set column values align
			mygrid.setColTypes("ed,ed,ed,ed,ed,ed,ed,ed,ed,ed");//set column types
			mygrid.setColSorting("db_connector,connector,connector,connector,connector,connector,connector,connector");//set sorting
			mygrid.setSkin("dhx_blue");//set grid skin
			mygrid.attachHeader('#connector_text_filter,#connector_text_filter,#connector_text_filter,,,<button  id="delete_row" style="text-align:center; padding:20px; margin: 10px auto 0 auto;">Delete Client</button>,<button id="add_user"  style="padding: 10px;">Add Client</button>');
			mygrid.init(); //initialize grid
		//	mygrid.attachEvent("onRowSelect",doOnRowSelected);
			mygrid.loadXML('db_connector.php'); //load data
  			var dp = new dataProcessor('db_connector.php');
			dp.init(mygrid);
			});
		
		
		function doOnRowSelected(rowID,celInd){
        		alert(rowID);
 
    		};
});

My connector

?php 
include 'dhtmlxSuite/dhtmlxConnector/php/codebase/grid_connector.php';

$conn = mysql_connect("localhost", "root", "root");

if (!$conn) {
   die('Could not connect: ' . mysql_error());
}
$test = mysql_select_db("loxx", $conn);

if(!$test)
	throw new Exception('Table not found.');

$grid = new GridConnector($conn);
$grid->enable_log("mylog.txt",true); 

$grid->render_table("clients","id", "name,address,town,phone,cell,email,username,password,contact,smart_phone_user");

?>

Any help thanks.

adaptive · August 28, 2012, 8:30pm

anyone?

sematik · August 29, 2012, 2:06pm

Unfortunately the issue still cannot be reproduced.
Deleting of the selected row works well for us.
Adding+selecting of the row also works correctly.

If issue still occurs - please, provide a demo-link where the issue can be reproduced.

adaptive · August 29, 2012, 8:42pm

Can you provide me with the latest fixes to grid.js, connector.js, and dataprocessor.js to check if that is an issue.

thanks,

sematik · August 30, 2012, 2:33pm

Please, open ticket at support.dhtmlx.com and provide a complete demo so we can reproduce the issue and provide the actual fixes.