I'm probably missing something obvious, but I can't see it.
I have a page where users will be able to upload and resize a
portrait. I am using the following code to handle toggling resizable
on/off:
=================================
<code>
$(function() {
$("div.resizecontrols").click(function(event) {
var $resizetarget = $(event.target);
alert("you clicked resizecontrols div");
if ( $resizetarget.is("input.enableresize") ) {
var $thiscontrol =
$(this).parents(".control:first").attr("id");
var $thisobjectid = $thiscontrol ;
var $ourid = $thisobjectid.slice(2);
var $canvasid = 'cv' + $ourid;
$( "#" + $canvasid ).resizable({
handles: "all",
aspectRatio: true,
helper: "resizehelper",
knobHandles: true
});
}
if ( $resizetarget.is("input.disableresize") ) {
var $thiscontrol =
$(this).parents(".control:first").attr("id");
var $thisobjectid = $thiscontrol ;
var $ourid = $thisobjectid.slice(2);
var $canvasid = 'cv' + $ourid;
$( "#" + $canvasid ).resizable("destroy");
}
});
});
</code>
=================================
The code acts upon the following DIV:
=================================
<code>
<div class="control" id="ec004">
<form enctype="multipart/form-data" action="portrait.php"
method="POST" id="up004" class="uploadimage">
<fieldset>
<ol>
<li class="uploadimg">
<label for="portraitimg_file">Upload a file:</label>
<input name="portraitimg_file" id="portraitimg_file" type="file" />
<input name="thename" class="thename" value="portrait.jpg"
type="hidden">
</li>
</ol>
</fieldset>
<input type="submit" name="submit" value="Upload File" />
</form>
<div class="resizecontrols">
<input type="button" value="Turn Resizing On" class="enableresize" />
<input type="button" value="Turn Resizing Off" class="disableresize" /
>
</div>
</div>
</code>
=================================
It works just fine, prior to using jqUploader. I can click the
buttons to enable resizable on the portrait image.
After uploading an image via jqUploader, clicking on my resize control
buttons has no effect. As you can see, I added the following alert to
show the buttons have been clicked: alert("you clicked resizecontrols
div"); After using jqUploader, this alert never files. I have to
reload the page before it will work again.
I used Firefox's Webmaster Tools plugin to view the Rendered Source of
my control div after jqUploader ran. The source looks as follows... I
can see no reason the buttons should no longer work.
=================================
<code>
<div class="control none block" id="ec004">
<form enctype="multipart/form-data" action="portrait.php"
method="post" id="up004" class="uploadimage">
<fieldset>
<ol>
<div id="jqUploader-0" class="flash-replaced"><embed
flashvars="containerId=jqUploader-0&uploadScript=portrait.php
%3FjqUploader%3D1&afterScript=none&allowedExt=*.jpg%3B%20*.jpeg
%3B%20*.png&allowedExtDescr=Images%20(*.jpg%3B%20*.jpeg%3B%20*.png)
&varName=portraitimg_file&barColor=66CC00&startMessage=Upload
%20a%20file%3A&errorSizeMessage=File%20is%20too%20big!
&validFileMessage=Now%20click%20Upload&progressMessage=Please
%20wait%2C%20uploading%20&endMessage=You're%20all%20done"
pluginspage="http://www.adobe.com/go/getflashplayer"
src="jqUploader.swf" type="application/x-shockwave-flash"
id="movie_player-0" bgcolor="#FFFFFF" params="menu=false" height="100"
width="400"></div>
</ol>
</fieldset>
<input style="display: none;" name="submit" value="Upload File"
type="submit">
</form>
<div class="resizecontrols">
<input value="Turn Resizing On" class="enableresize" type="button">
<input value="Turn Resizing Off" class="disableresize" type="button">
</div>
</div>
</code>
=================================
Does anyone have a suggestion of what might be wrong? Or a suggestion
for a troubleshooting method I could use to figure it out?
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---