JQuery .append() добавляет невидимые элементы, видимый текст

Я использую JQuery для добавления элементов формы при нажатии кнопки. Проблема в том, что я не могу заставить элементы отображаться. Отображается только текст "-- начните вводить имя--". Когда я щелкаю правой кнопкой мыши и проверяю элемент, я вижу все отображаемые элементы jquery. Не существует стилей, чтобы новые добавленные элементы не отображались. Ошибок консоли нет.

Это фрагмент из моего файла .js, он должен вставлять элементы формы.

$(document).ready(function() {


    var orgPosition = 0;
    $("#addOrgButton").click(function() {
        orgPosition++;

        $('#orgs').append('<br><div class="field_container"><form:label path="org_id"><spring:message code="label.org_id" /></form:label><form:select id="org_id" class="selectorg" path="jobOrgs[' + orgPosition + '].org_id"><form:option value="0">-- Start typing name --</form:option><form:options items="${organizationsList}" itemLabel="organization" itemValue="org_id" /></form:select></div>');
    });

из моего JSP...

<form:form id="formid" method="post" action="addJob.html" commandName="jobModel">
    <div id="orgs">
        <div class="field_container">
            <form:label path="full_name">
                <spring:message code="label.jobFullName" />
            </form:label>
            <form:input class="input" path="full_name" />
            <form:errors path="full_name" cssClass="job_error" />
        </div>
        <br>
        <div class="field_container">
            <form:label path="abbreviation">
                <spring:message code="label.abbreviation" />
            </form:label>
            <form:input path="abbreviation" />
        </div>
        <br>
        <div class="field_container">
            <form:label path="org_id">
                <spring:message code="label.org_id" />
            </form:label>
            <spring:bind path="jobOrgs[0].org_id">
                <form:select id="org_id" class="selectorg" path="${status.expression}">
                    <form:option value="0">-- Start typing name --</form:option>
                    <form:options items="${organizationsList}" itemLabel="organization" itemValue="org_id" /></form:select>
            </spring:bind>
        </div>
    </div>
    <input type="button" id="addOrgButton" value="Add" />
    <br>
</form:form>

Это скриншот страницы с соответствующими элементами после нажатия «Добавить». Как видите, на странице есть элементы, но они невидимы. У меня должно быть два выпадающих списка «Организация». моя страница после нажатия кнопки


person BoatCode    schedule 03.04.2014    source источник
comment
Пахнет как css сложенные правила имеют значение .. Любой URL?   -  person Stphane    schedule 03.04.2014
comment
они даже действительные элементы? Это анализируется браузером, а не сервером, поэтому как браузер поймет <spring:message code="label.org_id" /> и другие ваши элементы - просмотрите раскрывающийся список другой вашей организации и посмотрите, выглядит ли он так же, как тот, который вы только что создали.   -  person wirey00    schedule 03.04.2014
comment
@ᾠῗᵲᄐᶌ ‹spring:message code=label.org_id /› — это тот же элемент, который отображает организацию перед первым выпадающим списком.   -  person BoatCode    schedule 03.04.2014
comment
Это на странице jsp, которая работает на стороне сервера и анализируется там в действительный HTML - ваш браузер этого не понимает   -  person wirey00    schedule 03.04.2014
comment
@ f00bar, я пробовал вообще без CSS. firebug подтверждает, что стиль не задействован.   -  person BoatCode    schedule 03.04.2014
comment
@ᾠῗᵲᄐᶌ, я понимаю, о чем ты говоришь. Как бы я обойти это?   -  person BoatCode    schedule 03.04.2014
comment
так что вы просто хотите сделать копию выпадающего списка? или варианты разные?   -  person wirey00    schedule 03.04.2014
comment
Параметры будут такими же... возможно, я мог бы закодировать некоторые из них на странице как невидимые и сделать их видимыми при нажатии кнопки "Добавить"... но я не хотел ограничивать количество добавляемых   -  person BoatCode    schedule 03.04.2014
comment
всегда есть .clone(), который позволяет вам сделать копию элемента - тогда у вас просто есть увеличить это число   -  person wirey00    schedule 03.04.2014
comment
@ᾠῗᵲᄐᶌ, Круто! Я нашел чужую ветку, где у них есть клон() и сопоставитель регулярных выражений для увеличения. Теперь все это имеет смысл. Спасибо!   -  person BoatCode    schedule 03.04.2014


Ответы (1)