[pradeepg459]

I have a problem with drag table in mozilla php (smarty) using javascript functions.
The code used is :

Code:

{foreach from=$heading_array item=hdng key=col_name name=headng_loop}
<td width="40px;" id='column{$col_name}' name= {$col_name} sort="" {if $align_view.$col_name.CWDTH neq '0' or $align_view.$col_name.CWDTH neq ''} style="padding-left:3px;word-wrap:break-word;{*$align_view.$col_name.CWDTH*};"{/if} {if $wrapflag neq '' or $wrapflag neq 0}style='vertical-align:top;'{/if}>{if $drag_flg eq 1}
<table height=100% cellSpacing=0 cellPadding=0 border=0 style="">
<thead>
<tr>
<td>{/if}{if $align_view.$col_name.CWDTH eq '0' or $align_view.$col_name.CWDTH eq ''}
<nobr {if $drag_flg eq 1} id='columnTitle{$col_name}'
STYLE=" overflow: hidden; text-overflow: ellipsis;" {/if}
>{/if}
<a href="#" onClick="javascript:sortByCol('{$col_name}');">{$hdng}</a>
<a href="#" onclick="javascriptpenFilterRow(this,'sort_clm{$col_name}');fltr_sz(this);" id='anchor_{$col_name}'>&raquo;</a>
<input type="hidden" name="sort_cl[{$col_name}]" id="sort_clm{$col_name}" value="{$sortcl.$col_name}"/>
<input type="hidden" name="sort_ad[{$col_name}]" id="sort_{$col_name}" value="{$sortad.$col_name}"/>{if $align_view.$col_name.CWDTH eq '0' or $align_view.$col_name.CWDTH eq ''}
</nobr>
{/if}{if $drag_flg eq 1}
</td>
</tr>
</table>{/if}
</td>
{if $smarty.session.BROWSER.NAME eq 'IE'}
<td {if not $smarty.foreach.headng_loop.last}style="width:1px"{/if} >
<img src="{$smarty.const._IMAGE_PATH}/spacer.gif" height=100% border=0 style="position: relative; left: 2px" {if $drag_flg eq 1} title="Drag To Resize" onMouseOver="this.style.cursor='E-resize';" onMouseDown="javascript:ResizeColumnOnMouseDownEvent('flexibleTable', '{$col_name}', 'document')"{/if}>
</td>
{else}
<TD STYLE='width:0px;TEXT-ALIGN:RIGHT;CURSOR:E-RESIZE;' >
<img src="{$smarty.const._IMAGE_PATH}/spacer.gif" height=100% border=0 style="position: relative; left: 2px" {if $drag_flg eq 1} title="Drag To Resize" onMouseOver="this.style.cursor='E-resize';" onMouseDown="javascript:MozillaOnMouseDownEvent(this,event,'column{$col_name}')" onmousemove="javascript:MozillaOnMouseUpEvent(event);"{/if}>
</TD>
{/if}
{/foreach}
<input type='hidden' name='tableMove' id='tableMove' value=''>
<input type='hidden' name='tdMove' id='tdMove' value=''>
<input type='hidden' name='tdDrag' id='tdDrag' value=''>

My javascript functions are :

Code:

function MozillaOnMouseDownEvent(obj,event,obj1){
// alert(obj1);
document.getElementById('tableMove').value=obj1;
document.getElementById('tdMove').value=event.clientX;
document.getElementById('tdDrag').value=1;
}
function MozillaOnMouseUpEvent(event){
//alert(event);
//alert(document.getElementById('tdDrag').value);
if(document.getElementById('tdDrag').value==1){
newPos = event.clientX;
prevPos = document.getElementById('tdMove').value;
tdCol = document.getElementById('tableMove').value;
alert(tdCol)
prevWidth = document.getElementById(tdCol).style.width;
alert(prevWidth);
if(parseInt(newPos)>parseInt(prevPos)){
presPos = parseInt(newPos)-parseInt(prevPos);
if(parseInt(prevWidth)){
document.getElementById(tdCol).style.width = parseInt(prevWidth)+parseInt(presPos)+'px';
}
else{
document.getElementById(tdCol).style.width = parseInt(presPos)+'px';
}
alert(prevWidth+'*******'+tdCol+'------'+presPos+'if---'+document.getElementById(tdCol).style.width);
}
else{
presPos = parseInt(prevPos)-parseInt(newPos);
if(parseInt(prevWidth)){
document.getElementById(tdCol).style.width = parseInt(prevWidth)-parseInt(presPos)+'px';
}
else{
document.getElementById(tdCol).style.width = parseInt(presPos)+'px';
}
//alert(tdCol+'------'+presPos+'else---'+document.getElementById(tdCol).style.width);
}
document.getElementById('tdDrag').value='';
}
}

While drag TD of the width not setting Properly but javascript functions are working ...
Any suggestions ..
Thanks in Adv