Help needed with simple js quiz form! [duplicate] - javascript

This question already has answers here:
Closed 12 years ago.
Possible Duplicate:
Help me fix my JavaScript Quiz
Hi, this javascript form isn't working as there is some kind of bug/error in the code which I can't find! It should activate a pop-up after answering the 4 questions and clicking the 'submit' button - letting the user know if they have passed or failed the little test.
Instead of posting all the code it is here in the doc. head here: http://bit.ly/g4jO3J
Any help would be appreciated for this project.

You have a redundant onclick= in your submit button. Instead of:
<input name="button" type="Submit" onClick="onclick=return checkAnswers()" />
Use:
<input name="button" type="Submit" onClick="return checkAnswers()" />

Your script contains HTML:
<script>
// your code
<form name="Quiz" onsubmit="return validate(this)">
<input type="submit" />
</form>
</script>
That causes a syntax error. But that's probably not the problem.

function validate(myForm) { => function validate() {
var allQuestions = new Array(Quiz.q1,Quiz.q2,Quiz.q3,Quiz.q4); => var allQuestions = new Array(document.Quiz.q1,document.Quiz.q2,document.Quiz.q3,document.Quiz.q4);
onClick="return checkAnswers()" => onClick="return validate()"

Thanks for your help - I got it working eventually!!
If anyone is looking for a simple javascript quiz then visit the page (link above) and click view source to see the code.

Related

I can't edit my <input type="file"> tag [duplicate]

This question already has answers here:
Style input type file? [duplicate]
(6 answers)
Closed 8 years ago.
I cannot edit this button, I tried using bootstrap javascript. Here's a sample of my code. Any help would be greatly appreciated
<html>
<head>
<script type="text/javascript" src="assets/js/bootstrap-filestyle.js"> </script>
<script>
$(":file").filestyle({input: false});
</script>
</head>
<body>
<input type="file" class="filestyle" data-input="false">
</body>
</html>
Short answer: you can't. The text is predefined by the browser.
A workaround might be to use an image or a third party file uploader.
Check out this related answer: How to change the button text of <input type="file" />?
I think what you are trying to do is replace the text "Choose file" into something else;
If that is the case try the following statement.
Sorry, not enough reputation to comment.
<input type='file' style='opacity: 0; width:90px; position: absolute; z-index:2'>
<button class='btn-margin btn grey' style='z-index: 1;width:90px;cursor:pointer;'>Browse</button>";

Cannot programmatically submit form [duplicate]

This question already has answers here:
"Submit is not a function" error in JavaScript
(19 answers)
Closed 8 years ago.
Cannot get my form to submit programmatically, despite trying several ways. Tried pure JS, also tried jQuery. No success.
I have this form tag :
<form action="https://docs.google.com/forms/d/13zex8ZsEsnZz3A8uB4jU4oDb5wZfaqqq2Pq2CGlIe6M/formResponse" method="POST" id="ss-form" target="_self" onsubmit="" name="eForm">
<!--My Form Stuff-->
<input type="submit" name="submit" value="Submit" id="ss-submit">
</form>
Here is what i've tried :
/*jQuery*/
$('#ss-form').submit();
/*Javascript*/
document.getElementById('ss-form').submit();
document.eForm.submit();
None of them work. Not sure why, but I am assuming it has something to do with me trying to submit a google form. If I physically click the submit everything works fine.
Any and all help is greatly apprecaiated.
The problem is that you have a field (HTMLInputElement) with name submit in the form. That's why document.getElementById('ss-form').submit is not a function but an object.
So, you get the following error:
TypeError: object is not a function
The solution is to remove that element. We should be careful to verify if browser thinks it's an element and not a function:
if (typeof document.getElementById('ss-form').submit === "object") {
document.getElementById('ss-form').submit.remove();
}
document.getElementById('ss-form').submit();

Why won't my js form submit work? [duplicate]

This question already has answers here:
Property 'submit' of object #<HTMLFormElement> is not a function
(3 answers)
Closed 9 years ago.
I have an iframe and a form. I want to submit the form into the iframe. This works, but the JS won't submit the form. I want the form to submit on page load or just when the script is rendered by the browser. I have already tried about 10 different JavaScript variants and successfully submitted the form with a button. Any thoughts?
<iframe src="http://domain.com" name="i0"></iframe>
<form action="http://domain.com/" target="i0" id="f0" method="POST">
<input type="hidden" name="secret" value="4cda562cd5dafa1882c9f18dc0dc5dba">
<input type="hidden" name="id" value="39">
</form>
<script type='text/javascript'>
document.getElementById('f0').submit();
</script>
<input type="submit" name="submit">
this is what's causing your issue, change its name to something else. because now this
document.getElementById('f0').submit();
is trying to access that input, and giving the error:
TypeError: document.getElementById(...).submit is not a function
You should have posted all your form code here, we could have found it faster :)
Maybe it is because your iframe hasn't fully loaded yet, so you need to wait for it:
<script type='text/javascript'>
document.getElementsByName('iframe')[0].onload = function(){
document.getElementById('f0').submit();
}
</script>
I see, you cant' use name="submit" here because you are overwritting FORM submit method, change it, e.g:
<input type="submit" name="bsubmit">

Javascript not working somehow - not sure what I am doing wrong :/ [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking for code must demonstrate a minimal understanding of the problem being solved. Include attempted solutions, why they didn't work, and the expected results. See also: Stack Overflow question checklist
Closed 9 years ago.
Improve this question
I am not sure what is wrong so I just thought of asking you all. I want to validate some variables via JS before I send them to my PHP Script, but somehow it's not working as I want and I am not sure why. Here my example code :
HTML
<script src="jadd.js" type="text/javascript"></script>
<form name="jadd" action="./func/add_job.php" method="post" onsubmit="return vf()">
random submit
...
<input type="text" size="100" maxlength="150" name="jt" />
...
</form>
Javascript (jadd.js):
function vf() {
var x=document.forms["jadd"]["jt"].value;
if (x==null || x=="") {
alert("Field must be filled out");
return false;
}
}
You have two problemsedited your question.
When you programatically submit a form, you won't trigger the submit event. Use a real submit button (<input type="submit">), not a link with JavaScript instead of an HTTP URI. (You can use CSS to make a button look like a link if you really want to).
You are trying to call a function called vf but you have defined a function called vf_addjob, you need to use the same name!
Try using vf_addjob() instead of vf()
should be :
onsubmit="return vf_addjob()"
Remove your a href... button.
Add inside the form this <input type="submit" value="click me">
Should look like this:
<script src="jadd.js" type="text/javascript"></script>
<form name="jadd" action="./func/add_job.php" method="post" onsubmit="return vf()">
...
<input type="text" size="100" maxlength="150" name="jt" />
...
<input type="submit" value="click me">
</form>
It would also be good practice to add a return true; in the JS function. But that's more for code readability.

onClick not working

My button with id "jump-button" is not working at all. Whenever it is clicked nothing will happen. (I have added a alert(); to the onclick attribute so I know when the button is working.
The other two buttons (next and prev) are working absolutely fine.
<body>
<div id="fact">Fact #1: In 2002, the most popular boat name in the U.S. was Liberty</div>
<input id="next" type="image" src="images/next-button.png" name="next" value="Next" onClick="num++;document.getElementById('fact').innerHTML=getFact(num);"/>
<input id="prev" type="image" src="images/prev-button.png" name="previous" value="Prev" onClick="num--;document.getElementById('fact').innerHTML=getFact(num);"/>
<p id="jump-text">Jump To Fact #</p>
<input id="textarea" type="text" name="factNumber" />
<input id="jump-button" type="image" src="images/jump-button.png" name="jump" value="Jump" onClick="alert();num = document.getElementById('textarea').value;document.getElementById('fact').innerHTML='getFact(num);"/>
</body>
External JS File (it has been inported in the HTML header)
facts = [element1, element2, ... wayy too many elements to have them all here];
var num = 1;
function getFact (num){
return 'Fact #' + num + ' ' + facts[num-1];
}
As you can see, this is a very simple app being built (something that just runs through various interesting facts). I am fairly new to javascript, so please excuse me if I made a very blatant error.
My CSS file is very nice and simple too, I doubt it it causing the trouble, but if it is required I will shot it upon request.
Lastly, the rest of the html <head> is also very simple (only consists of some meta data, title, css and javascript imports).
If anyone needs more information to help me get the "jump" button working, please ask.
You have a stray ' in your inline onClick attribute.
// ---------------------------------------------------v
onClick="...document.getElementById('fact').innerHTML='getFact(num);"

Categories

Resources