Javascript: how to pass *this arg..?

Mr. Flibble · 14-06-2007 2:30pm #1

I have something like this:
<form>
<input type="button" value="pressme" onClick="fn_press();" id="pressme22">
</form>

How can I pass the id of the form to the fn_press() function?

Any help/links appreciated.

egan007 · 14-06-2007 2:40pm

Try...

<form id="myform">

<input type="button" value="pressme" onClick="fn_press('myform');" id="pressme22">

</form>

<script>

function fn_press(formName) {

fName = document.getElementById("formName");

}
</script>

jessy · 14-06-2007 2:40pm

I think i am correct here...

when you click the button it calls the function fn_press(),

So from within that function you need a line of code like

var obj = document.getElementById('xxx');

where xxx = your formID

Mr. Flibble · 14-06-2007 3:01pm

I ment to ask how to pass the id of the input (ie. 'pressme22') not the form id.

jesse & egan007, I don't know the id of the input so I can't put it in place of xxx/myform.

I have got around the problem by placing in a value as you suggest in fn_press(a value) but would still like to know if there's away to do it without passing an argument like that.

I thought this.id might reference the id but it didn't seem to work.

jessy · 14-06-2007 3:12pm

hey Mr. Flibble,

on both examples document.getElementById is used so it should not matter if it is a form or div or what ever tag really it will just return the id of what ever you search for so if you do
document.getElementById(''pressme22') it should work fine too

egan007 · 14-06-2007 3:14pm

just use the name of the input...
<input type="button" value="pressme" onClick="fn_press('pressme22');" id="pressme22">

There is a way, I don't know it off hand but I don't see why you need to make it complex.

imeatingchips · 14-06-2007 3:20pm

The best way is with the "this" object:

<form>
<input type="button" value="pressme" onClick="fn_press(this);" id="pressme22">

<input type="button" value="pressme" onClick="fn_press(this);" id="pressme23">
<input type="button" value="pressme" onClick="fn_press(this);" id="pressme24">
<input type="button" value="pressme" onClick="fn_press(this);" id="pressme25">
</form>

<script type="text/javascript">
function fn_press(e){ // edit - note: at this stage, e refers to your input field...
alert(e.id);
// also try...
alert(e.value); // pressme
alert(e.type); // button
// even .....
alert(e.onclick); // fn_press(this);
}
</script>

Mr. Flibble · 19-06-2007 12:57pm

Cheers lads. I had to do it that way egan so I could use a loop to get at them as I had a large number of buttons.

Another JS problem now.

I have a number of form elements,
document.form1.name1
document.form1.name2
document.form1.name3
...
..
.

and I want to reference these in a JS loop. document.form1.name+i doesn't work. document.form1.name+"i" doesn't either.

I can change the way the form elements are named. Can I do something like name[1] etc for different elements?

imeatingchips · 19-06-2007 2:21pm

try

document.form1["name" + i].value

Mr. Flibble · 19-06-2007 3:21pm

imeatingchips wrote:

try

document.form1["name" + i].value

Nope. You don't want the .value there do you?
I tried both and a few other variations with no luck.

imeatingchips · 19-06-2007 4:17pm

re: .value - well it depends on what property of the field you want to get. I assumed .value but anyhoo... that code definitely works. Below is an example:

<html>
<head>
<script type="text/javascript">
function go() {
alert(document.form1["name" + 1].value);
}
</script>
</head>
<body>
<form name="form1">
<input type="text" value="howaye flibble" name="name1"/>
<input type="button" value="press me" onclick="javascript:go();"/>
</form>
</body>
<html>

Have you got your form named "form1"?

Have you got your fields named "name1" and not "name 1" or "name_1" or something?

Paste or PM me the code if you're still stuck.

Mr. Flibble · 19-06-2007 4:43pm

Ok. That works for .value but doesn't seem to work in returning the object reference (?).

I have this exactly:

AddToOptionList(document.form1.mylist1, "12", document.form1["mylist"+1].value);

function AddToOptionList(OptionList, OptionValue, OptionText) {
OptionList[OptionList.length] = new Option(OptionText, OptionValue);
}

Which works and adds a list option to the list called document.form1.mylist1.

But if I try
AddToOptionList(document.form1["mylist"+1], "12", document.form1["mylist"+1].value); it doesn't work. Would there be a .something I can add to the end to get it to work?

imeatingchips · 19-06-2007 5:27pm

nah if its returning a property of the object then it has to have the reference.

ah wait. you're missing .options after your selectlist reference. try:

function AddToOptionList(OptionList, OptionValue, OptionText) {
OptionList.options[OptionList.length] = new Option(OptionText, OptionValue);
}

edit -
make that:

function AddToOptionList(OptionList, OptionValue, OptionText) {
OptionList.options[OptionList.options.length] = new Option(OptionText, OptionValue);
}

Mr. Flibble · 20-06-2007 10:16am

That works perfectly. Thanks imeatingchips.

Javascript: how to pass *this arg..?

Comments