Doan Cuong
Doan Cuong

Reputation: 2614

Object #<HTMLDivElement> has no method 'empty'

I'm so confuse with this. I'm using jquery 1.9.1 to append a div's inner html to another div. But when trying to debug with chrome developer tools, it gave me this error inside jquery library.

my Html:

<body>
    <s:form action="/save" method="POST">
        <div class="educationForm">
            <div class="educations">
                <label>Position</label>
                <input type="text" name="educations[0].index" value="1" />
                <br/>
                <label>School</label>
                <input type="text" name="educations[0].school" />
                <br/>
                <label>Degree</label>
                <input type="text" name="educations[0].degree" />
                <br/>
                <label>GPA</label>
                <input type="text" name="educations[0].scored" />
                <br/>
                <label>Start Date</label>
                <input type="text" name="educations[0].startDate" />
                <br/>
                <label>End Date</label>
                <input type="text" name="educations[0].endDate" />
                <br/>
            </div>
        </div>  <a href="#" id="addButton">Add new Edu</a>

        <input type="submit" value="Save" />
    </s:form>
    <div class="template_educations" style="display:none">
        <div class="educations">
            <label>Position</label>
            <input type="text" name="educations[_X_].index" />
            <br/>
            <label>School</label>
            <input type="text" name="educations[_X_].school" />
            <br/>
            <label>Degree</label>
            <input type="text" name="educations[_X_].degree" />
            <br/>
            <label>GPA</label>
            <input type="text" name="educations[_X_].scored" />
            <br/>
            <label>Start Date</label>
            <input type="text" name="educations[_X_].startDate" />
            <br/>
            <label>End Date</label>
            <input type="text" name="educations[_X_].endDate" />
            <br/>
        </div>
    </div>
</body>

My js:

$(document).ready(function(){
    $("#addButton").click(function(event){
        event.preventDefault();
        $(".educationForm").append($(".template_educations").html);
        $(".educationForm").children(".educations").last().children("input").each(function(){           
            var count = $(".educationForm").children(".education").length();
            var value = $(this).attr("name");
            value.replace("_X_", count + 1);
            $(this).attr("name", value);
        });         
    });
});

Please help me determine whether this is a bug in jquery library or there's something wrong with my code, since i didn't use any function empty inside my code

Upvotes: 0

Views: 2742

Answers (2)

John
John

Reputation: 539

use this line

 $(".educationForm").append($(".template_educations").html);

as like

    $(".educationForm").append($(".template_educations").html());

Upvotes: 2

bipen
bipen

Reputation: 36531

it should be html()..instead of html..

....
$(".educationForm").append($(".template_educations").html());
....                                                 //--^^---here

Upvotes: 5

Related Questions