I've been facing this problem for the past couple of days. I have an input of type "file" inside a tooltip. When I click on the button to open the file dialog, nothing shows up. Now I tried to use
Valums AJAX Upload and the same thing happens. The problem is there aren't any errors so I do not know how I can debug to find out what the problem is... Here's my code:
<div class="liImageThumb tooltip-trigger">
<div class="tooltip down">
<div class="tooltip-arrow"></div>
<p class="liUploadButton greenButton">Upload</p>
<p class="okButton"></p>
</div>
</div>
<script type="text/javascript" src="@Url.Content("~/Scripts/fileuploader.js")"></script>
<script type="text/javascript">
$(function () {
var greenButton = $('.liUploadButton')[0];
var uploader = new qq.FileUploader({
element: greenButton,
action: '@Url.Action("Upload", "Item")' //outputs the correct DOM node
});
console.log(greenButton);
});
And here's the code that builds up the tooltip:
$('.tooltip-trigger').removeClass('nonjs').live('mouseover', function(){
var $trigger = $(this);
var $tooltip = $('.tooltip',$trigger);
if (!$trigger.data('init')){
$trigger.data('init', true);
if($tooltip.length){
$trigger.hoverIntent({
'over':function(){$tooltip.show();},
'out':function(){$tooltip.hide();},
'timeout':200
});
$trigger.trigger('mouseover');
}
}
});
What do you think is preventing the dialog box from showing up?