View Full Version : Draggable search pane

08-13-2010, 05:37 PM
<td valign="top">&nbsp;</td>
<td id='gridTD' style="vertical-align:top;">
<iframe name="exportIF" id="exportIF" src="" style="visibility:hidden;" width="0" height="0"></iframe>

<div id='reportmain' style="position:relative;">
<div id="advancedsearch" class="ui-jqgrid ui-widget ui-corner-all"
style="margin:35px; padding:10px; position: absolute; left:0px;
top:75px; font-size:8pt; z-index:99;
background-color:#DDECF7; color:#0E539E; width:600px">
<table width="100%" cellpadding=0 cellspacing=0 border=0>
<td align=left>
<div onmouseover='$("#advancedsearch").draggable("enable");' onmouseout='$("#advancedsearch").draggable("option","disabled",true)'
style='cursor:move; width:20px; height:20px;'>
<img src="images/move.png"/>

<td align="right">
<span class='ui-jqgrid ui-icon ui-icon-circle-close'
style="left:" onclick='toggleAdvancedSearch();'>
<div style="padding:5px; height:300px; background-color:#DDECF7;
color:#0E539E; font-size:9pt;">
<form id="advancedsearchform">
<table class="ui-jqgrid ui-widget">

<td align='center'>
<input type="button" style='border:1px solid #0E539E;
background-color:#FFF;' name='Apply' value='Apply Filter'
<b>All Demographics</b>&nbsp;
<input name='all_check' type=checkbox

<div style="overflow-y:auto; overflow-x:hidden; height:275px;
width:575px; border:1px solid #555;">
<table class="advsearch" id="advsearchbox">
</table><!-- table gender -->
</table><!-- table adv_search_demo_outer-->

I've tried the following:

$("#advsearchbox").draggable({disabled: false});

and nothing works.

The box starts as hidden and then appears after link is clicked. I just want to drag the box.

08-15-2010, 12:49 PM
It's invisible I think because there's nothing within the table, so you can't see it to drag it. If I add some code into your table:

<table class="advsearch" id="advsearchbox">
<td>Some text</td>
</table><!-- table gender -->

then it's draggable with:


08-15-2010, 04:09 PM
The table starts as invisible, but we can click a link to get it to pop up.

That works. But when it pops up, it's not draggable.