Column height per class with JavaScript and PHP -


i have following code in script set max height each column. however, intend set max height individually 4 columns per row. won't execute function per class.

here's javascript:

<script type="text/javascript" > $(document).ready(function() {  <?php $test = $cart->count_contents(); ($i=0, $n=$test; $i<$n; $i++) { ?> setheight('.<?php echo 'col'.$i; ?>'); <?php   } ?>  });    //initialize global variable, store highest height value var maxheight = 0;   function setheight(col) {    //get element class = col col = $(col);  //loop col col.each(function() {  //store highest value if($(this).height() > maxheight) { maxheight = $(this).height();; } });  //set height col.height(maxheight); } </script> 

i pull out each row mysql database php , generate following html:

<div class="ui-grid-c ui-bar ui-bar-e"> <div class="ui-block-a"><div class="ui-bar ui-bar-b" style="height: 20px;">remove</div></div>  <div class="ui-block-b"><div class="ui-bar ui-bar-b" style="height: 20px;">product(s)</div></div> <div class="ui-block-c"><div class="ui-bar ui-bar-b" style="height: 20px;">qty.</div></div> <div class="ui-block-d"><div class="ui-bar ui-bar-b" style="height: 20px;">total</div></div>  <div class="ui-block-a"><div class="ui-bar ui-bar-c col0"><input type="checkbox" name="somename1" value="somevalue1"></div></div>    <div class="ui-block-b"><div class="ui-bar ui-bar-c col0"><a href="#"><img src="images/someimage1.gif" border="0" alt="sometitle1" title="sometitle1" width="100" height="80"></a> <a href="#"><b>sometitle1</b></a><br><small><i - >somecontent</i></small><br><small><i> - somecontent</i></small><br><small><i> - somecontent</i></small></div></div>  <div class="ui-block-c"><div class="ui-bar ui-bar-c col0"><input type="text" name="somename1" value="1" size="4"></div></div> <div class="ui-block-d"><div class="ui-bar ui-bar-c col0"><b>sometext1</b></div></div>   <div class="ui-block-a"><div class="ui-bar ui-bar-c col1"><input type="checkbox" name="somename2" value="somevalue2"></div></div>    <div class="ui-block-b"><div class="ui-bar ui-bar-c col1"><a href="#"><img src="images/someimage2.gif" border="0" alt="sometitle2" title="sometitle2" width="100" height="80"></a><a href="#"><b>sometitle2</b></a></div></div> <div class="ui-block-c"><div class="ui-bar ui-bar-c col1"><input type="text" name="somename2" value="1" size="4"></div></div> <div class="ui-block-d"><div class="ui-bar ui-bar-c col1"><b>sometext1</b></div></div>   </div><!-- /grid-a --> 

question not right place answer yourself, i'll copy solution

you need change:

 //initialize global variable, store highest height value var maxheight = 0;   function setheight(col) { // etc etc etc 

to:

function setheight(col) {  var maxheight = 0;  //etc etc etc 

Comments

Popular posts from this blog

linux - Using a Cron Job to check if my mod_wsgi / apache server is running and restart -

actionscript 3 - TweenLite does not work with object -

jQuery Ajax Render Fragments OR Whole Page -