0

I'm trying to send a value from the form to the new window that opens. In my program the window opens but the value val2 is not sent and instead null exists.

My code:

function eq(value) {
  ViewImg = window.open('http://localhost/coord.php?' + value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
}
<form id='testform_eq' name='testform_new'>
  <input type='text' id='val2' name='val2'>
  <input type='button' value='Submit' onclick='eq(document.getElementById(val2))'>
</form>

Does anyone have an idea why this is so? Thanks

Improve this question

3 Answers 3

Reset to default
1 

function eq() {
  const value = document.getElementById('val2').value;
  ViewImg = window.open('http://localhost/coord.php?' + value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
}
<form id='testform_eq' name='testform_new'>
  <input type='text' id='val2' name='val2'>
  <input type='button' value="Submit" onclick='eq()'>
</form>

You don't need to pass anything to the click function. Since you already have an id attribute to your input element you can get the value of the input when you click it. Probably you would wanna use that function in other places and that would mean that you would have to pass every time that element.

If you really want to pass something you can pass the id itself.

eq('val2')

The eq function would look like this than:

function eq(id){
  const value = document.getElementById(id).value;
  ....
}

Than you can use that function in other places on other inputs.

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Could do with an explanation, but this is the right answer (out of the ones so far)
I see the difference only in getting the value, in this answer, it's got inside a function instead of passing the value as a parameter. It's the matter of taste I think, especially if you want to use the same function just for opening, and passing different values inside.
I edited the answer and probably now it would make more sense.
0

If you want to pass a value of an input, you should take into account two things:

  1. getElementById accepts a string, but you're trying to pass a variable, which doesn't exist
  2. If you want to pass a value and not an element, you should add .value after the element

And finally you should have the input element like this:

<input type='button' value='Submit' onclick='eq(document.getElementById("val2").value)'>

Here is a live example:

<script>
function eq(value) {
  console.log(value);
  ViewImg = window.open('http://localhost/coord.php?' + value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
}
</script>

<form id='testform_eq' name='testform_new'>
  <input type='text' id='val2' name='val2'>
  <input type='button' value='Submit' onclick='eq(document.getElementById("val2").value)'>
</form>

Another option is to get the value inside the function, as described here. This way is good if you're not going to reuse eq with different values. You have to choose one of them depending on your real case.

Improve this answer

6 Comments

Do you have an idea how do I send 2 fields and not one field ?
Sure, if you need, you can just pass multiple values (if your choice is to work with parameters), or get both inside the function instead
Like this ? <input type='button' value='Submit' onclick='eq(document.getElementById("val2").value,"val3").value)'></form>
If you're trying to get a value from another input, it should look like this: eq(document.getElementById("val2").value, document.getElementById("val3").value). But a better way is to move this logic for getting values inside JS file and don't litter your HTML.
What about function eq(value) { ? Need to change the number of parameters there too? How does he know the difference between value and value?
|
0

Because you're supposed to do it like this: document.getElementById("val2").value

document.getElementById(val2) is incorrect if you want to get the id=val2 value.

To fix it you can replace eq(document.getElementById(val2) into eq(document.getElementById("val2").value)

function eq(value) {
  ViewImg = window.open('http://localhost/coord.php?' + value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
  console.log(value);
}
<form id='testform_eq' name='testform_new'>
  <input type='text' id='val2' name='val2'>
  <input type='button' value='Submit' onclick='eq(document.getElementById("val2").value)'>
</form>

or simply put the id in function call: eq(val2)

function eq(id) {
  ViewImg = window.open('http://localhost/coord.php?' + id.value, 'ViewImg', 'width=<?php print $realWidthNewWindow; ?>,height=<?php print $realHeightNewWindow; ?>', 'status=no', 'titlebar=0');
  console.log(id.value);
}
<form id='testform_eq' name='testform_new'>
  <input type='text' id='val2' name='val2'>
  <input type='button' value='Submit' onclick='eq(val2)'>
</form>

Improve this answer

2 Comments

This won't change a thing. It still calls eq() with an undefined value, but then logs the correct value to the console. You've highlighted where the code is wrong but done nothing to fix it.
@Archer That's what I intend to do though. To show which one is supposed to do it. I've updated with the working function.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.