I have develope a program to get selected text from dropdown menu. This code is working in jsFiddle. but doesn't work in Browser. Is anything problem in jquery coding?
Dropdown
$(document).ready(function(){
$('#ddl').change(function(){
var text= $('#ddl :selected').text();
$('#ddltext').html(text);
});
});
CSPIT
ADIT
BVM
DDIT
Nirma
Thanks in advance.
try this:
$('#ddl').change(function(){
var text= $('#ddl option:selected').text();
$('#ddltext').html(text);
});
working fiddle here: http://jsfiddle.net/APNFd/
i hope it helps.
Try disabling Plugins and change global variables name if it works with Jsfiddle not in browser this mean conflict in plugins scripts.
If this does not work please show us all of the codes to detect errors.
Related
I want to get input text value in checkout page.
I have tried to apply jquery in checkout page but it didn't work it. I have also worked with pure javascript but it also didn't work.
Jquery not working because checkout page working only knockout js
<script type="text/javascript">
require([ 'jquery', 'jquery/ui'], function($){
jQuery(window).load(function(){
jQuery("#shipping-new-address-form input[name='vat_id']").keyup(function(e) {
alert("test");
});
});
});
</script>
This code is working fine on console.
Please help me and solve this issue
Thanks in advance.
Hi please try the below code and it should work as i am already using something like this and it is working fine.
<script type="text/javascript">
require(['jquery', 'jquery/ui'], function($){
jQuery(document).on('keyup', '#shipping-new-address-form input[name="vat_id"]', function(e) {
alert("test");
});
});
</script>
Magento 2 works with requireJS library, so you need to use "require"/"define" function to receive the jquery.
I think that you want to change the shipping behavior, so, you can do a fallback of shipping.js from Magento_Checkout module and add your code there.
your-theme/Magento_Checkout/web/js/view/shipping.js
on my page I'm trying to apply jquery ui tooltip on a specific element:
<script>
$(function() {
$('.aticker').tooltip(); //works perfectly
});
</script>
but no options are working at all, so:
$('.aticker').tooltip({track: true}); // not working
$(document).tooltip(); //not working ( i have to use selector and not document)
$('.aticker').tooltip({tooltipClass:'rd'}); // not working
not sure what is wrong with it.
I found out that there was a confliction between bootstrap.js and jquery.js tooltip.
known issue
Tooltip conflict with jQuery UI #6303
I am not allowed to comment because of a lack of reputation, so I will post this as an answer. I created a jsfiddle based on your information. For me it seems to work perfectly well.
I used the links to the javascript files from your post and $('.aticker').tooltip({track: true}); works.
Could you please provide further information such as any errors shown in the javascript console?
I am trying to do something very simple. If you go to http://cutecuttingboards.com/product/apple/, I simply want to hide the "From:" price after the user choose a size in the drop down menu. I am trying the code below, which is working fine in Fiddle but not on the live site:
jQuery('#size').on('change', function(){
jQuery('p.price').hide();
});
Here is the fiddle with unformatted code: http://jsfiddle.net/anneber/U2Mat/
Any help is much appreciated!
Anne
i know it's kind of late but.. in case someone else is having the same problem, this should do the trick:
jQuery(document).ready(function($) {
$(document).on("change", ".variations #size", function() {
$('p.price').hide();
});
});
If I copy/paste your code above into web inspector and then change the selection it works, so most likely, the code is either not in the page, not being run, or being run before the related elements have been loaded into the DOM.
There is an error in your cutecutb.js file the Unterminated comment. i.e you are not terminating the comment
There is no "*/" sign.
EDIT :
Now another reason in add-to-cart-variation.min.js there is already an onchange event of dropdown
You can see you "#size" element is inside ".variations" class
I am trying to understand the difference between JQuery and JavaScript.
And apologies if this is a silly question.
This is my attempt at JQuery. On pressing the button the text in <p> should change as requested. I cannot get this to work.
http://jsfiddle.net/QaHda/7/
this is my JavaScript attempt. I cannot get this to work either
http://jsfiddle.net/aLhb8/1/
Can someone please help me with
my jQuery above to get it working.
my jscript above to get it working.
I was trying to get to a point where I could write my JQuery in such a way that it could be written in javascript. Can anyone help me do this?
Thanks
EDIT
Thanks for all the answers/corrections: what I was looking for part 3 was this enter link description here which basically does part 1 using javaScript,I think. In future I should be careful,using left hand pane, to include Jquery library and to make sure jsript is wrapped in head/body
jQuery
You need to include jQuery library to your page by selecting a jQuery version in the first dropdown in the left panel
Demo: Fiddle
JS Sample
The problem is since your function is defined within the onload callback, it was not available in the global scope causing an error saying
Uncaught ReferenceError: myFunction is not defined
The solution is to add the script to the body elements, instead of inside the onload callback by selecting No Wrap - in <body> in the second dropdown in the left panel
function myFunction()
{
alert("Hello World!");
}
Demo: Fiddle
jQuery is library of javascript function and you need to add jquery file in html file that y jquery function was not working and for javacript function you need to change the setting in jfiddele left to no-wrap in head
http://jsfiddle.net/aLhb8/1/
http://jsfiddle.net/hushme/QaHda/10/
here is code
$("button").on("click", function () {
$("p").text("this text will now appear!!")
});
If you have internet connection, This should work
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
$(document).ready(function() {
$('button').click(function() {
alert("This is a simple alert message");
});
});
But if don't then just download the jquery framework and include into your page
Hope it helps and anyway jquery is a framework of javascript, so they are both or they are the same. Don't confuse yourself.
Here is a JavaScript version - http://jsfiddle.net/aLhb8/4/
JavaScript
var myButton = document.getElementById('myButton');
myButton.addEventListener('click', function(){
alert(myButton.textContent);
});
Check this link out if you want to start learning more about JavaScript - http://javascriptissexy.com/how-to-learn-javascript-properly/
For the pure JS code, on the top left panel, select 'No wrap - in body'. This will make your code run without a problem.
In the jQuery code, make sure you've selected the jQuery library, as opposed to pure JS. You hadn't selected this before, so your code was invalid.
I've read through a number of similar questions but nothing has worked for me yet. The url is here: http://www.promotion1.com/home-wmc-slide
I've installed a slider and the images are stacking before the script, I do not know JavaScript...
Would anyone be willing to look at the site and see if there might be a quick fix? I seriously need the help.
Thank you!
Try changing your javascript from $(window).load(...) to $(document).ready(..)
$(document).ready(function (){
$("#pikame").PikaChoose();
});
Make sure you're using the newest version of PikaChoose and then do the following.
For your css:
#pikame{ display:none; }
In your js:
$(document).ready(function (){
var showUL = function(){ $("#pikame").show(); };
$("#pikame").PikaChoose({buildFinished:showUL});
});