Hi,

I need to get a table in javascript n i wrote this code:

//mainMenu is the table name
var x = document.getElementById("mainMenu")
//then i need to get it's left margin so i wrote

var x = document.getElementById("mainMenu").style.marginLeft;

But it is giving error that x is null. Can any one please correct it?

Thanks for your time
Regards

The "mainMenu" should be the id of the table.
Since you are using this: document.getElementById("mainMenu") It is quite obvious when you say "getElementById" that the argument should be the id of the element you are trying to take.

Thanks for your reply.

I have defined the table id "mainMenu", so thats why using here. Can you please further guide?

Post move to JavaScript, dunno why it was posted in JSP (Java Server Pages) section...

I usually use javascript to manipulate the state and value of the input fields. Haven't combined it with tables.
But I would suggest to post the code you have for the table as well as the javascript code and describe what you are trying to accomplish. If I know it I will reply

> But it is giving error that x is null. Can any one please correct it?

Because the `style' property is only set when inline style sheets are used. To get the style details of the element whose style is set using linked or embedded style sheets, you need to put in a bit of effort. Read this.

Try this example out. This uses jQuery to grab the css properties you want. Even on elements that do not have inline styles.

This is what matters, it serves the jquery library from googles cdn, but this could be from a local copy too. jQuery CSS Documentation
Sends two alerts to the browser the first with the padding-left value and the second with the margin-left value.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
   alert( $("#someTable").css('padding-left') );
   alert( $("#someTable").css('margin-left') );
 });
</script>

This is the full example, but i gave my table and id of "someTable"
You could use whatever you wanted.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
   alert( $("#someTable").css('padding-left') );
   alert( $("#someTable").css('margin-left') );
 });
</script>
<style>
table {
	padding-left: 10px;
	margin-left: 50px;
}
</style>
</head>

<body>
<table width="200" border="0" cellpadding="2" id="someTable" >
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>

Thanks to all of you for helping me.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.