how to insert data into

Question

here is my code:

<form action="eventssearch.php" method="post" onsubmit="return checkDate();">
    <p>
        <label for="date1">Date in the format DD/MM/YYYY:</label><br />
        <input type="text" id="date" name="date11" />
        <input type="submit" value="Check " />
        <br />(example 26/04/1975) <span class="error"> </span>
    </p>
</form>

I wrote the following code which didnt work:

var dateField=document.getElementById('error');
dateField.value = "hi Mom"

Is there some kind of parent-child relationship here which I am not seeing ? If so, how can I spot it ?

You have no element with `#id` like `error` in HTML – Artem Petrosian May 07 '14 at 11:30 — Artem Petrosian, May 07 '14 at 11:30

antoniovassell · Accepted Answer · 2014-05-07T12:16:01.543

1

First issue, you are calling the function getElementById('error'), when the span element has a class 'error', not an id. Hence it will never find it. You should change the class="error" to id="error". Then you can say dateFiled.innerHtml = "Hi Mom" instead of .value

edited May 07 '14 at 12:16

answered May 07 '14 at 11:31

antoniovassell

1,012
14
24

Hawk · Answer 2 · 2014-05-07T11:40:30.823

0

<span class="error"></span>

<script>
    var dateField = document.getElementsByClassName('error');
    dateField[0].innerHTML = 'hi Mom';

    //or you could use
    var dateField2 = document.getElementByClassName('error');
    dateField2[0].textContent = 'hi Mom'; // this is using dom nodes
</script>

view fiddle http://jsfiddle.net/h_awk/tFrx7/

Get the element by class name if it is span class=error

edited May 07 '14 at 11:40

answered May 07 '14 at 11:30

Hawk

788
1
6
18

thank you, but you didnt answer my second question: Is there some kind of parent-child relationship here which I am not seeing – user3551969 May 07 '14 at 11:31
if you want to use nodes to traverse the DOM, there is a different way – Hawk May 07 '14 at 11:32
The question used `.getElementById('error');`. There's no logical reason to use a class here, instead. Fix the HTML, instead of modifying the code to work with incorrect HTML ;-) – Cerbrus May 07 '14 at 11:36
the title says '' – Hawk May 07 '14 at 11:36
Sometimes, there is an better way to do what the OP wants to do ;-) – Cerbrus May 07 '14 at 11:37

score 0 · Answer 3 · edited May 07 '14 at 12:08

Firstly you should use right method to get class instance but you are using getElementById() for getting class instance. Use getElementsByClassName() or querySelector() method and second, I think you should use innerHTML if you are using javascript or if you are using jquery then use text() or html() method.

Solution:

var err = document.getElementsByClassName('error')[0];
err.innerHTML = "say hi!";

how to insert data into

3 Answers3