Jscript : Function not working

Question

I make a function to validate some required field on a form . But the function is not functioning , i dont know what is wrong please help me out .

SCRIPT:

 function validateForm()
    {
    var x=document.forms["function_search_form"]["id"].value;
    var y=document.forms["function_search_form"]["name"].value;
    if (x==null || x=="")
      {
      alert("ID must be filled out");
      return false;
      }
      if (y==null || y=="")
      {
      alert("Name must be filled out");
      return false;
      }
    }

FORM :

<p><a href="borang_pencarikerja.php">Tambah Pencari Kerja Baru</a>&nbsp;<a href="borang_pencarikerja.php"><img src="images/add_16.png" width="16" height="16" border="0" align="absbottom" /></a></p>
<form action="simpan_jobseeker.php" method="post" enctype="multipart/form-data" name="function_search_form" id="function_search_form" class="search_form" onsubmit="validate()">

<td colspan="2"><strong>ID</strong>
<input type="text" name="id" id="txt_no_kp" value="<?php echo $no_kp; ?>" />
<div id="autocomplete_no_kp" class="autocomplete"></div></td>

<td colspan="2"><strong>Name</strong>
<div id="div_nama"><input name="name" type="text" id="txt_nama" size="40" /></div></td>

Whenever you post this kind of question it will be better if you refer a `jsfiddle` for quick and correct answer — Manish Kumar, Feb 04 '14 at 10:28

score 0 · Answer 1 · answered Feb 04 '14 at 10:25

function validateForm()
    {
    var x=document.getElementById("id").value;
    var y=document.getElementById("txt_nama").value;
    if (x==null || x=="")
      {
      alert("ID must be filled out");
      return false;
      }
      if (y==null || y=="")
      {
      alert("Name must be filled out");
      return false;
      }
    }

score 0 · Answer 2 · answered Feb 04 '14 at 10:30

Kindly check this code you were missing to close form tag and also you were calling wrong function name.

<script type="text/javascript">
function validateForm()
    {
    var x=document.forms["function_search_form"]["id"].value;
    var y=document.forms["function_search_form"]["name"].value;
    if (x==null || x=="")
      {
      alert("ID must be filled out");
      return false;
      }
      if (y==null || y=="")
      {
      alert("Name must be filled out");
      return false;
      }
    }
</script>

<p><a href="borang_pencarikerja.php">Tambah Pencari Kerja Baru</a>&nbsp;<a href="borang_pencarikerja.php"><img src="images/add_16.png" width="16" height="16" border="0" align="absbottom" /></a></p>
<form action="simpan_jobseeker.php"  method="post" enctype="multipart/form-data" name="function_search_form" id="function_search_form" class="search_form" onsubmit="return validateForm()">

<td colspan="2"><strong>ID</strong>
<input type="text" name="id" id="txt_no_kp" value="<?php //echo $no_kp; ?>" />
<div id="autocomplete_no_kp" class="autocomplete"></div></td>

<td colspan="2"><strong>Name</strong>
<div id="div_nama"><input name="name" type="text" id="txt_nama" size="40" /></div></td>

    <input type="submit" value="Submit"/>
    </form>

score 0 · Accepted Answer · edited May 23 '17 at 12:28

var x=document.forms["function_search_form"]["id"].value;
var y=document.forms["function_search_form"]["name"].value

This does get the .id and .name properties of your <form>, which both are the string "function_search_form" - which does not have a .value property. Instead, either get the inputs by ID:

var x=document.getElementById("txt_no_kp").value;
var y=document.getElementById("txt_nama").value;

or by their name in the .elements collection:

var x=document.forms["function_search_form"].elements["id"].value;
var y=document.forms["function_search_form"].elements["name"].value;

See also Best Practice: Access form elements by HTML id or name attribute?

Jscript : Function not working

3 Answers3