unable to select from drop-down with firefox (works in Chrome) - javascript

What I want to do is be able to select from the drop-down menu without the accordion changing. This works in Chrome. However, when I was trying it in Firefox, it no longer worked.
Here is my jsfiddle.
Why does this not work in Firefox?
I believe that it is this code that is causing the problem (dropdowns without the selectOne class work fine):
$(function () {
$('.selectOne').click(function(){
return false;
});
});

Try to upload the linked libraries. Have you linked the plugin. Accordian is a jQuery Plugin, not just jQuery.

Related

$('body').on('click','.class_name', function(){}); not working in IE

I am trying to make a block clickable by a class named atnd_modal and opening a modal popup on click
I am doing this-
$('body').on('click','.atnd_modal', function(){
//modal opening code here
});
Its working fine in chrome and other browser but its not working in IE.
I also tried window instead of body but its not working.
and its working when i am trying with IE in useragent.
How can i make this working in IE ?
jquery on requires jquery version 1.7 or later ..try delegate if your version is below
$('body').delegate('.atnd_modal','click', function(){
//modal opening code here
});
And most importantly make sure to check jquery is included

bootstrap affix not working properly with firefox

I am trying to have a left sidebar in my rails application that uses bootstrap affix. I have set up this bootply to share my approach:
http://www.bootply.com/mwg1ZEM8zh
It works just like wanted with Chrome, but with Firefox affix stops working everytime I follow a link (the sidebar is in every page of my app). If I refresh the page affix starts working again. I have used data attributes to add the affix behavior, no javascript at all. Should I use javascript? Am I doing something else wrong?
I am using bootstrap 2.3.2.
I ended up using javascript as well and now it works with Firefox as well.
<script>
$('.sidebar').affix();
</script>

how to do document.ondrop in firefox?

The document.ondrop seems to work in chrome, but not in firefox?
Attached is an example:
http://auth.letschat.info/test2.php
If you drop a file on to the page it should pop up an alert box. However it doesn't work in firefox, but does in chrome.
When I use firefox console the document.ondrop handler is correctly set.
Assuming the original javascript looks like this and works in Chrome:
document.ondrop=function(event){
alert("hello");
}
It can be changed to work in both Firefox and Chrome. Firefox requires you to stop the default action from occuring when you drag a file over, which can be solved by using the ondragover event. The following javascript code will also work in Firefox:
document.ondragover = function(event){
event.preventDefault();
}
document.ondrop=function(event){
alert("hello");
}
I found this solution by looking at w3schools and looking for the differences between their simple example and your code.
From html5rocks on slide #18 there is also an html5 example of another way to use drag and drop by adding the listener to the page.

Code won't work properly in Firefox or IE

Here is what is supposed to happen:
The moment the user chooses an option a certain combination of input fields should show up along with two tables.
When the user fills in the input fields and clicks the button, the results should appear in the tables.
Those tables aren't showing up. The input fields don't even show up in js fiddle.
It only works in the newest versions of Firefox, Chrome, Safari and IE.
Not in firefox 6.0 or IE 9.08.
I made the mistake of coding exclusively in Chrome at home to discover that my code doesn't work when I tried to continue working at school.
I used jsfiddle.net to validate my code and did so successfully. Although it still won't work. It doesn't even show up properly inside jsFiddle.
Here is the fiddle to demo the code:
http://jsfiddle.net/Q2nz5/5/
The outputTable method contains line Caption.align = "middle", which cannot be executed in IE and apparently in FF as well. replace it with Caption.style.textAlign = "middle"; and it will fix the problem.
The same with MCaption.
But the best you can do here is to define all styles like that in css.
In your js fiddle you were getting this error: inputOutputCreator is not defined. It is because you are loading your js in the mootools onLoad function. Change it from onLoad to no wrap in the jsfiddle settings to the left. With that changed it worked just fine for me.

JQuery Slider Control - slider-handle not moving

I've got a text scrollbox made with JQuery. It works fine when on its own (nationalboston.com/temp) but when I hand it off to be wrapped into a Joomla page, the slider handle doesn't move (here). As far as I can tell, everything else works fine.
I've inspected the computed CSS in Chrome Inspector, and it seems that the handle is styled as it should be (position:absolute; top:auto;). What am I doing wrong?!
EDIT:This appears to be the case in Safari 3.x Mac and Chrome 3 Alpha Mac, Not in Firefox Mac. I haven't done further testing.
I followed your link in Firefox 3.0.11 on mac and the slider works perfectly. Did you find the solution to your problem? The first idea that came to me when I read your question was that you might have a javascript namespace conflict (using more than one JS framework?). A possible solution would then have been to run JQuery in no-conflict mode, as in:
jQuery.noConflict();
// Do something with jQuery
jQuery("div p").hide();
// Do something with another library's $()
$("content").style.display = 'none';
More info there: http://docs.jquery.com/Core/jQuery.noConflict

Categories

Resources