Question

98

how to get the size of td

rated 0 times [ 101] [ 3] / answers: 1 / hits: 25034 / 13 Years ago, sat, march 19, 2011, 12:00:00

i have a table which in which i have td .when i click in text field which has onkeypress
event select values from database a table is shown from whic i select value.this select table is in div which position is fixed.but it will also chang the height

<td class=value>vehicle </td><td> 

 <input type=text id=txt_sh_vid onKeyPress=vhc_record() maxlength=4>

  <div id=div_vhc  class=search_form>

</div>





 <input type=text id=vid style=display:none;>

JavaScript:

function vhc_record() {

    var data = 'vhc=' + document.getElementById('txt_sh_vid').value;

    loadXMLDoc('ship/vehicle_ship/', 'div_vhc', data);

    document.getElementById('div_vhc').style.visibility = visible;

}

it is css of the above table

    td.value

    {

    background-color:#00628B;

    color:#E6E6DC;

    height:50;



    }



    div.search_form

    {

    position:fixed;

     background-color:white;



}

when i press key in textfield it will also change the height of class=value
like div id=div_vhc while its height is 50

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

trayvon

Add To Favorites

Follow

Total Points: 35

Total Questions: 117

Total Answers: 88

Location: Guernsey

Member since Tue, Jul 6, 2021

3 Years ago

trayvon questions

1 Bootstrap modal UncaughtType Error on modal loading

Sun, Apr 24, 22, 00:00, 2 Years ago

1 Iterate through array of objects using javascript

Wed, Feb 9, 22, 00:00, 2 Years ago

1 Error in function createFiberFromTypeAndProps in ./node_modules/react-dom/cjs/react-dom.development.js:25058

Sun, May 23, 21, 00:00, 3 Years ago

1 Why could window scroll event not being fired

Tue, Jul 14, 20, 00:00, 4 Years ago

1 Error: Connecting to a SFTP server with ssh2-sftp-client in a AWS lambda function throws a time out

Thu, Jun 4, 20, 00:00, 4 Years ago

View All

answered 13 Years ago billt · Accepted Answer

Here is the JSFiddle Demo. Let me know if this is what you are looking for:

I am guessing what you are looking for is to grab td.value width and height. You can use offsetHeight or offsetWidth

I am not very sure what you are trying to do, but to get the height of td.value you can do the following assume based on the structure of html. of course if you wish to traverse through all td element and find the element w/ the class name value then you'll have to use regex to match the element with value as part of its class:

Your vhc_record function midified:

var myvalue = document.getElementsByTagName('td')[0];  //grabs the td.value element based on your html markup



document.getElementById('div_vhc').style.height = myvalue.offsetHeight+'px';  //sets div_vhc height to that of td.value

document.getElementById('div_vhc').style.width= myvalue.offsetWidth+'px';//sets div_vhc width to that of td.value

The changes i made to the html and css and i added some visiblity properties to make the example looks apparent:

<table><tr><td class=value>vehicle </td></tr></table>

<input type=text id=txt_sh_vid onKeyPress=vhc_record() maxlength=4>

<div id=div_vhc  class=search_form>

</div>





<input type=text id=vid style=display:none;>



td.value

{

    background-color:#00628B;

    color:#E6E6DC;

    height: 50px;   

    width: 50px;

}



#div_vhc

{

    position:fixed;

    background-color:white;

    display: none;

    border: 1px solid black;

}