Solved

Problems with certain jQuery functions in Internet Explorer

Posted on 2014-10-07
10
137 Views
Last Modified: 2014-10-08
I am having problems retrieving values using certain jQuery functions in my code whenever I am using Internet Explorer 9.0 and below as the browser. The .value() and the ToUpper() functions do not seem to work. They work correctly when I use Mozilla and Chrome as the browser. Is there any workaround to this ?
0
Comment
Question by:giveindia
10 Comments
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
.value() and the ToUpper() ?
did not saw that in their documentation
0
 
LVL 51

Expert Comment

by:Julian Hansen
Comment Utility
whenever I am using Internet Explorer 9.0 and below
Why worry about below? IE8 is dead - died with XP - I wouldn't worry about it.
What version of JQuery are you using 1.x or 2.x - if latter have you tried the latest 1.x build?

As leakim points out .value() is not a jQuery function .val() is

There is a toUpperCase javascript function but neither a ToUpper Javascript or Jquery function.
0
 

Author Comment

by:giveindia
Comment Utility
We are trying to use the code below to retrieve values from a hidden variable.
var hidtaxben = '<%=hidTaxBenifit_MOP.Value%>';
 var hidmatchbal = '<%=hidMatchContriBalance_MOP.Value%>';
0
 
LVL 51

Expert Comment

by:Julian Hansen
Comment Utility
Ok but how does that relate to your original question.

The above code is rendered Javascript which you are populating with values from ASP

This will result in something like
var hidtaxben ='somevalue';
var hidmatchbal =  'someothervalue';

Open in new window

The above are just declarations - they don't do anything.
As you are rendering out Javascript with ASP - is it not possible that you are mixing up which functions belong to which environment - can you post more of your code and specifically is causing a problem.
The code you have posted should have no issues in any browser - they are just declarations.
0
 

Author Comment

by:giveindia
Comment Utility
Sorry for the incomplete post. Here is what we are trying to do.  The code below tries to get the value from the hidden field. For some reason while this code works across all the other browsers it does not work with IE 9.0 and below. Any workaround that we can try ?
var taxBenifitName = document.getElementById("hidTaxBenifit_MOP");
           var taxMachingContributionAmount = document.getElementById("hidMatchContriBalance_MOP");
           var txtCurrency = document.getElementById("hdnCurrencySh_MOP");
           var txtCurrencyAmount = document.getElementById("hdnCurrencyAmountSh_MOP");
0
Maximize Your Threat Intelligence Reporting

Reporting is one of the most important and least talked about aspects of a world-class threat intelligence program. Here’s how to do it right.

 
LVL 51

Expert Comment

by:Julian Hansen
Comment Utility
Again this code does nothing - if you were to put that in an html file and load the file - nothing would happen.

All you are doing is assigning variables - and the manner in which you are doing them is compatible across all browsers.

You need to show us the code is not working - what is it the code is trying to do - how is the error showing itself.

Please post all your code for the page - the above is not helpful.
0
 
LVL 51

Expert Comment

by:Julian Hansen
Comment Utility
Are you putting that code inside an onload function i.e.
Try the following code in IE9 and below
<!doctype html>
<html>
<head>
<title>Test</title>
<script src="http://code.jquery.com/jquery.js"></script>
<script type="text/javascript">
// IMPORTANT CODE GOES INSIDE THE ONLOAD
// SO IT FIRES WHEN DOCUMENT IS FULLY LOADED
window.onload = function() {
  var taxBenifitName = document.getElementById("hidTaxBenifit_MOP");
  var taxMachingContributionAmount = document.getElementById("hidMatchContriBalance_MOP");
  var txtCurrency = document.getElementById("hdnCurrencySh_MOP");
  var txtCurrencyAmount = document.getElementById("hdnCurrencyAmountSh_MOP"); 
  alert(taxBenifitName.innerHTML);
}
</script>
<style type="text/css">
</style>
</head>
<body>
<div id="hidTaxBenifit_MOP">1</div>
<div id="hidMatchContriBalance_MOP">2</div>
<div id="hdnCurrencySh_MOP">3</div>
<div id="hdnCurrencyAmountSh_MOP">4</div>

</body>
</html>

Open in new window

It might be that you are trying to set the variables to elements that have not loaded yet.
Sample here http://www.marcorpsa.com/ee/e001.html
Tested down to IE8 - works as expected.
0
 

Author Comment

by:giveindia
Comment Utility
Attached herewith is a screenshot of the error message. Please let me know if you need anything else.

Thanks,
Aditya
shoppingcart.jpg
0
 
LVL 51

Accepted Solution

by:
Julian Hansen earned 500 total points
Comment Utility
The screen shot does not seem to show anything useful. The one error is an unterminated string constant on line 2817 - but the screen shot only goes up to line 2811
The second error is on line 938 - also not visible in the screenshot

I went to the URL in the screenshot with IE8 - no errors.
However if we look at where the code you posted above occurs and search for the respective id's we find the following

<input name="_ctl0:_ctl0:ContentPlaceHolder1:ContentPlaceHolder1:hidTaxBenifit_MOP" type="hidden" id="ContentPlaceHolder1_ContentPlaceHolder1_hidTaxBenifit_MOP" value="false" />

Open in new window


i.e. The id you are referring to in the getElementById does not exist in the document - the input id is actually

ContentPlaceHolder1_ContentPlaceHolder1_hidTaxBenifit_MOP

Open in new window


And not just

hidTaxBenifit_MOP

Open in new window


In ASP.Net you have to ouput the generated ID of a control - not what you cal it.
Try changing the declaration lines to

var taxBenifitName = document.getElementById("<%=CONTROLNAME.ClientId%>");

Open in new window


Where CONTROLNAME is the name of the control generating the input.

That will ensure that the ID you are referencing in your javascript matches the id rendered out by the control
0
 
LVL 75

Expert Comment

by:Michel Plungjan
Comment Utility
Also this is not jQuery

    var taxBenifitName = document.getElementById("hidTaxBenifit_MOP");
    var taxMachingContributionAmount = document.getElementById("hidMatchContriBalance_MOP");
    var txtCurrency = document.getElementById("hdnCurrencySh_MOP");
    var txtCurrencyAmount = document.getElementById("hdnCurrencyAmountSh_MOP");

Open in new window


Neither are they returning values. Assuming they are form fields you need

    var taxBenifitName = document.getElementById("hidTaxBenifit_MOP").value;
    var taxMachingContributionAmount = document.getElementById("hidMatchContriBalance_MOP").value;
    var txtCurrency = document.getElementById("hdnCurrencySh_MOP").value;
    var txtCurrencyAmount = document.getElementById("hdnCurrencyAmountSh_MOP").value;

Open in new window


which in jQuery would be

    var taxBenifitName = $("#hidTaxBenifit_MOP").val();
    var taxMachingContributionAmount = $("#hidMatchContriBalance_MOP").val();
    var txtCurrency = $("#hdnCurrencySh_MOP").val();
    var txtCurrencyAmount = $("#hdnCurrencyAmountSh_MOP").val();

Open in new window


also assuming that hidTaxBenifit_MOP is an ID and not a NAME
0

Featured Post

How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

Join & Write a Comment

Suggested Solutions

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

744 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

8 Experts available now in Live!

Get 1:1 Help Now