onsubmit function problem

[ginerjm]

A bit rusty on my JS but this seems correct to me. Just doesn't work.

 

	function CheckAddEntries()
	{
		var returnval = false;
		alert("in checkaddentries");
		var mname = document.getElementById('addform').getElementById('machine_name');
		alert("hit first value "+mname);
		var target = f.getElementById('target').value;
			return returnval;
	}

Right now the function seems useless, but that's because it's not working so far. Here's the call:

(This form is contains a single row of an html table)

 

$input_elems .= "<form method='POST' name='addform' id='addform' onsubmit='return CheckAddEntries()'>";
$input_elems .= "<tr>";
$input_elems .= "<td>";
$input_elems .="<input type='text' name='machine_name' id='machine_name' value=''>";
$input_elems .= "</td>";
$input_elems .= "<td>";
$input_elems .= "<input type='text' name='target' id='target' value=''>";
$input_elems .= "</td>";
$input_elems .= "<td>";
$input_elems .= "<input type='submit' name='btn' value='Add Machine'>";
$input_elems .= "</td>";
$input_elems .= "</tr>";
$input_elems .= "</form>";

When I click the Add Machine button the JS function shows my first alert message but it never shows the second one. Anyone see something I'm doing wrong here?

[Psycho]

I've never used getElementByID() recursively like this

var mname = document.getElementById('addform').getElementById('machine_name');

Is there a reason why you are referencing the form using getElementById() then trying to reference the 'machine_name' elements using getElementById() from that? Why not just directly reference the 'machine_name' element using

var mname = document.getElementById('machine_name');

Also, the function doesn't make sense. You are getting the value for Target, but then simply returning returnVal - which is false. I'm guessing this is not complete. And, there will also be a failure on this line since 'f' is not defined

 

var target = f.getElementById('target').value;

Edited July 29, 2015 by Psycho

[ginerjm]

Correct. As I said, it doesn't do anything yet because what I have doesn't work. And I have since altered my code a bit.

 

Now passing the form object with the call:

onsubmit='return CheckAddEntries(this.form)'

and retrieving the form object in the function like this:

function CheckAddEntries(frm)
{
  var f = frm;
  var returnval = false;
  alert("in checkaddentries ");
  var mname = f.getElementById('machine_name').value;
  alert("hit first value "+mname);
  var target = f.getElementById('target').value;
  return returnval;
}

I still get the first alert but not the second.

[ginerjm]

Ok solved it.

 

Used this format:

var mname = document.getElementById("machine_name").value;

to extract the form field value. Skipped by the form reference and went directly to the input element id.