Javascript-o-rama
- Started
- Last post
- 23 Responses
- juhls
How can I target a submit button in javascript so that an alert shows up once the user clicks on the button?
I can only work with this:
<input type="submit" name="btnDownload" id="btnDownload" value="Download Selected Songs" />
The easiest way would be to add an "onClick", but I don't think I can modify the HTML.
I tried this:
function DoTheCheck() {
if(document.songForm.song_1.chec... == true)
{ alert('box1 is checked'); }
if(document.songForm.song_2.chec... == true)
{ alert('box2 is checked'); }
}But you need the "onClick", correct? I am guessing I have to target it using the name or id.
- juhls0
(I am a n00b...)
- _salisae_0
so when are you going to buy a print from spooky?
- juhls0
What is likely the problem when the internal javascript works, but when you move it to an external file, it doesn't? Does it have to do with brackets?
- flashbender0
best post of 2009
- Stugoo0
lol so your fixed this yourself?
- neverblink0
Juhls, do you have the submit button on a form?
You need to ad an action to the form;
<form id="myform" onsubmit="domyaction()">
<input type="submit" value="submit me" />
</form>
- creez0
you better check the "Mastodon - Crack the Sky" thread.
- juhls0
I haven't actually fixed this yet because I was working on other parts of the script last night. And yeah, can't change the HTML. I'll be continuing it later today.
Basically, I need an alert of what songs the user checked in an above table.
- neverblink0
you can change the javascript? Because we don't really need to change the HTML to add this.
document.songForm.onsubmit = DoTheCheck();
- Stugoo0
if you cant change the html you might be stuck unless you can plug your script onto the back of another script that is activated when you activate those radio buttons,
or
you may be able to wrtie in the onclick function using javascript.
- juhls0
The form tag is just this, by the way:
<form name="songForm" id="songForm" action="#" method="post">
No onsubmit.
- stewdio0
JavaScript allows you to modify, append, and even delete entire chunks of HTML by manipulating the document's "elements." I think you're looking to do the following (TOTALLY UNTESTED!) sort of thing :
var myForm = document.getElementById( "songForm" );
myForm.onSubmit = "download.php";var myButton = document.getElementById( "btnDownload" );
myButton.onClick = "myValidation()";function myValidation()
{
// Validate form here
var myForm = document.getElementById( "songForm" );
// ---- add whatever you need to do with the data ---// Then submit
myForm.submit();
};
- neverblink0
no, but you add the onsubmit through javascript (see the line of code in my previous post).
You can add eventhandlers through javascript like onclick, ondblclick, onmouseover, onmouseout etc. You don't necessarily need to do this in the HTML.
- jpea0
You could also use something like jQuery which allows you to easily target an element in your html without modifying the actual html. Something like
$("myform").submit(function() {
if ($("input:first").val() == "correct") {
$("span").text("Validated...").s...
return true;
}
$("span").text("Not valid!").show().fadeOut(1000);
return false;
});
- stewdio0
You say you can't change the HTML, which is unfortunate, but you may still be able to use jQuery which will make everything much easier. http://jquery.com
Assuming your external JavaScript file is being called in the HTML's <HEAD> area you should be able to add a line to your code like :
document.write( "<script type='text/javascript' src='jquery.js'></script>" );
It's a bit ghetto, but may allow you to really manipulate the HTML with ease.
- juhls0
Yeah, I almost used jQuery, but I can't use that either. Specific guidelines :/
But thanks for all the help. I'll be trying some of these ideas out this afternoon.
- stewdio0
Sounds like an assignment I might give : http://art.yale.edu/Art167
- juhls0
It's one part of a larger project. I got most of it down. This is the one thing that's a bit annoying, but I'll get it.
- stewdio0
@uan I should further clarify. We conducted class in a lab full of iMacs with appropriate software installed. (Therefore no one needed to own their own machine and we would all be on the same page which makes teaching / learning easier.) There's no IE for the Mac anymore and Chrome wasn't even public last summer; certainly no Chrome Mac-beta to speak of.
Rather than running class as if it were part of vocational school, we focussed on concepts and approaches. Learning code was necessary, but the type of code itself was incidental in a way. The point was to begin to think in abstract computer terms rather than physical building terms. Having to troubleshoot for IE, the worst major browser out there, would have detracted from actually learning concepts by stealing away class time to troubleshoot a browser that undermines good practices.