views:

269

answers:

0

Im not sure if this is an issue with .appendTo() or the way im using it, I've gone over the docs in the api several times now and its still unclear so I figured I would turn it over to the handsome geniuses at SO.

I am trying to move some error li's generated by django and everything works fine so far in firefox however when the following js runs in IE the li's classed "errorlist" are moved arbitrarily down the page instead of into the div id'd "notify". If I change the .appendTo() to .prependTo() the li's get moved as expected but in the wrong order.

$(".errorlist").each(function(){
    var newid = $(this).parent().children('input').attr('id') + '_err';
    var oldpos = $(".errorlist").parent().children('input').position().top;
    $(".BatchInputData li:empty").remove(); 
    $(this).attr({'id' : newid, 'class' : 'error'});
    $(this).prependTo($("#notify"));
    $(this).css('position','absolute'); 
    $(this).css('top', oldpos - 50);
    $("#undefined_err").remove(); //remove any hidden field errors
})

EDIT: This is what is output in internext explorer when using .prependTo() - When using .appendTo() the code is added to "notify" as you would expect. The behavior is as expected in firefox using either method.

<div id="dep_container">
<div id="dep_status" class="lookup_status">
    <span id="jobinfo" class="lookup_info"> </span>
<div id="notify"></div>
</div>

<div id="dep_lookup" class="lookup">
    <form action="/deposits/dep/" class="lookup_form" id="dep_form" method="post">
    <h3>Deposits</h3>
    <ul class="BatchInputData styled">
    <li>
                <ul class="errorlist">
                    <li>(Hidden field OrgID) This field is required.</li>
                </ul>
            </li>
            <li>
                <label for="id_JobID">JobID:</label>
                <input type="text" name="JobID" value="224" id="id_JobID" />
            </li>
            <li>
                <ul class="errorlist">
                    <li>This field is required.</li>
               </ul>
               <label for="id_OrgName">OrgName:</label>
               <input type="text" name="OrgName" id="id_OrgName" />
            </li>
            <li>
                <ul class="errorlist">
                    <li>This field is required.</li>
                </ul>
                <label for="id_Entered">Entered:</label> 
                <input type="text" name="Entered" id="id_Entered" />
            </li>
            <li>
                <ul class="errorlist">
                    <li>This field is required.</li>
                </ul>
                    <label for="id_Deposited">Deposited:</label> 
                    <input type="text" name="Deposited" id="id_Deposited" />
                    <input type="hidden" name="OrgID" id="id_OrgID" />
            </li>
    <li>
                <input id="lookup_submit" type="submit" value="Submit"></input>
            </li>
    </ul>
</form>   
    </div>  
</div>