1

i am putting together some javascript form validation and i cant figure out how to get this onfocus to take hold of my div... i just need it to alert me that my onfocus function is making contact with my last name imput... :(

html:

<div id="contact">
    <form name="form1" action="send.php" method="post" id="contact_f">
      <table id="contact_table">
        <tr>
          <td class="col1" colspan="2">
            <h1 class="center_text">Contact Aron</h1>
            <div id="error_messages">
              errors
            </div>
          </td>
        </tr>
        <tr>
          <td class="col1">
            <label for="first_name">First Name*</label><br>
            <input id="first_name" required name="Name" type="text" pattern="[a-zA-Z]+">
          </td>
          <td class="col2">
            <label for="last_name">Last Name*</label><br>
            <input id="last_name" required type="text">
          </td>
        </tr>
        <tr>
          <td class="col1">
            <label for="email">Email*</label><br>
            <input id="email" required type="email">
          </td>
          <td class="col2">
            <label for="confirm_email">Confirm Email*</label><br>
            <input id="confirm_email" required type="text">
          </td>
        </tr>
        <tr>
          <td class="col1">
            <label for="phone">Phone Number   <span id="color_gray">xxx-xxx-xxxx</span></label><br>
            <input id="phone" type="tel" pattern="\d{3}[\-]\d{3}[\-]\d{4}">
          </td>
          <td class="col2">

          </td>
        </tr>
        <tr class="col2">
          <td class="col1" colspan="2">
            <label for="message">Message*</label><br>
            <textarea id="message" required type="text"></textarea>
          </td>
        </tr>
        <tr>
          <td class="col1" colspan="2">
            <button id="submit_button" type="submit" value="submit">Submit Form</button>
          </td>
        </tr>
      </table>
  </form>

javascript in question:

    document.getElementById("last_name").onfocus=function() {
      alert("last name");
    };
alilland
  • 881
  • 11
  • 29
  • I tested your code, `its running WELL!!!!` – Mr.Arjun Dec 29 '15 at 08:32
  • @Rajesh The element is an `input` element; the duplicate target is not relevant. Your DOM is probably not loaded at that time. Does the console print any errors? Where exactly is the script? – Sebastian Simon Dec 29 '15 at 08:34
  • @Xufox "i cant figure out how to get this onfocus to take hold of my div..." this explains different story? – Rajesh Dec 29 '15 at 08:37
  • Then probably it was my misunderstanding. My apologies. – Rajesh Dec 29 '15 at 08:42
  • The input is for my website contact form alilland.com what I posted above is the code for the form field, surprisingly I can't get any reaction from the JavaScript that should work fine Iv gone from id to id trying to get any indication at all that my JavaScript is grabbing hold of the form element – alilland Dec 29 '15 at 08:49
  • Possible duplicate of [Why does jQuery or a DOM method such as getElementById not find the element?](http://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method-such-as-getelementbyid-not-find-the-element) – Sebastian Simon Dec 29 '15 at 08:58

2 Answers2

0

You need to use:

document.getElementById("last_name").onfocus=function() {
   alert(this.value);
};
Milind Anantwar
  • 77,788
  • 22
  • 86
  • 114
  • I'm not trying per say to alert what I input I'm just trying to get any indication at all that my on focus event is touching the input field – alilland Dec 29 '15 at 08:43
  • @AronLilland: you should bind the event to div and then check whether target is input or not. are you fine with jquery solution. – Milind Anantwar Dec 29 '15 at 08:45
  • @AronLilland You still haven’t answered my questions: _“Your DOM is probably not loaded at that time. Does the console print any errors? Where exactly is the script?”_ – Sebastian Simon Dec 29 '15 at 08:46
0

Actually your code is working fine. You can try it with using jquery, like this - 

$(document).ready(function() {
$( "#last_name" ).focus(function() {
alert("Last name");
});  
});
Maddy
  • 105
  • 7