Solved

Javascript and passing variables to functions

Posted on 2014-04-11
6
348 Views
Last Modified: 2014-04-11
Hi All,

   I've never had to do this (not very familiar with JS) but I'm trying to pass multiple variables through to a function in Javascript.  This is what I have but it's not working...

In the header <script>
function yesno(a,b,c,d,e,f) {
	var yes = a;
	var yesbgcol = b;
	var yesfgcol = c;
	var pts = d;
	var answer = e;
	var elem = f;

	if (document.getElementById($elem).value == answer) {
		document.getElementById($elem).innerHTML = pts;
		document.getElementById($elem).style.backgroundColor=yesbgcol;
		document.getElementById($elem).style.color=yesfgcol;
	} else {
		document.getElementById($elem).innerHTML = "";
		document.getElementById($elem).style.backgroundColor='white';
		document.getElementById($elem).style.color='black';
	}
}

Open in new window


What I have in the HTML

<input type="text" id="flightdutylimitation" name="flightdutylimitation" required Pattern="[yYnN]" size=10 maxlength=1 onBlur="yesno('Y','red','white','FNA','Y','aflightdutylimitation');">

Open in new window


Thanks!
0
Comment
Question by:zack4x4
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
6 Comments
 
LVL 2

Accepted Solution

by:
GowthamNatarajan earned 500 total points
ID: 39994230
Please try this..
If using document.getElementById then dont use $
If you wanna change innerhtml of any other div, pass its id as 6th argument

<input type="text" id="flightdutylimitation" name="flightdutylimitation" required Pattern="[yYnN]" size=10 maxlength=1 onBlur="yesno('Y','red','white','FNA','Y','flightdutylimitation');">


function yesno(a, b, c, d, e, f) {
           
      var yes = a;
      var yesbgcol = b;
      var yesfgcol = c;
      var pts = d;
      var answer = e;
      var elem = f;

          if (document.getElementById(elem).value == answer) {
          
                document.getElementById(elem).innerHTML = pts;
                document.getElementById(elem).style.backgroundColor=yesbgcol;
                document.getElementById(elem).style.color=yesfgcol;
          } else {
          
                document.getElementById(elem).innerHTML = "";
                document.getElementById(elem).style.backgroundColor='white';
                document.getElementById(elem).style.color='black';
          }
    }
0
 
LVL 33

Expert Comment

by:Big Monty
ID: 39994476
you're mixing javascript and jquery it seems. wherever you have

document.getElementById($elem)

will fail, you're better off using the jquery syntax (a lot easier to read and produces shorter code. also, lines 2-7 in your function are not really needed, you can just define those variable names directly in your function definition. Here's how I would rewrite your function:

function yesno( yes, yesbgcol, yesfgcol, pts, answer, elem ) {

	if ( $elem).val() == answer) {
		$(elem).html( pts );
		$(elem).attr( 'backgroundcolor', yesbgcol );
		$(elem).attr( 'color', yesfgcol );
	} else {
		$(elem).html();
		$(elem).attr( 'backgroundcolor', 'white' );
		$(elem).attr( 'color', 'black' );
	}
}

Open in new window

0
 
LVL 33

Expert Comment

by:Big Monty
ID: 39994477
keep in mind, this answer will ONLY WORK if you are using jQuery on your page.
0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 4

Author Comment

by:zack4x4
ID: 39994515
Sorry Big - I was thinking half in PHP with the $ haha.  I tried to learn jquery but I don't have a solid base of javascript to start learning anything new.  It's so hard to try and keep up with all the changes. :(
0
 
LVL 33

Expert Comment

by:Big Monty
ID: 39994535
no problem, I understand, it's tough keeping up with all of the technologies out there :) if that's the case, GowthamNatarajan's solution should work.
0
 
LVL 4

Author Closing Comment

by:zack4x4
ID: 39994740
Thanks!
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

762 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