Это написано в Coldfusion, поэтому, пожалуйста, игнорируйте код разметки CF. Это вопрос jQuery.
У меня есть следующая таблица, которая повторяется от 1 до 200 раз в зависимости от проекта. Пользователь может ввести имя системы в поле systemname и нажать кнопку «ПРОВЕРИТЬ». Это запускает вызов ajax, чтобы проверить базу данных, чтобы увидеть, существует ли введенное системное имя в базе данных. Если это так, то он заполнит другие поля для пользователя. Я могу заполнить поле выбора местоположения в первом TR, но платформа / модель и предполагаемая дата начала эксплуатации не заполняются, потому что они находятся в другом TR. Я подтвердил это, удалив теги, и я знаю, что мои данные возвращаются хорошо - мне просто нужно поместить их в нужное место.
Обход DOM в устной форме будет выглядеть так:
После нажатия кнопки CHECK и возврата данных jQuery должен перейти к родительскому TABLE, затем на два TR и затем в TD, чтобы найти поля выбора, ввода и ввода платформы, модели и golive.
Я изучал обход DOM, но я не понимаю, когда что-то является родным братом, предками и т.д. XML ( Javascript-Basics-Part-6 ), но я надеюсь, что кто-то может предоставить лучшее руководство или пример обхода DOM.
Вот код таблицы
<cfloop query="rsRequestSystems">
<table cellpadding="3" class="tablesorter">
<tr>
<th class="form"><label>System Name</label></th>
<td><input name="systemname" type="text" class="systemname" value="#rsRequestSystems.systemname#" size="50" maxlength="50">
<div class="SystemNameStatus" style="color:##0000FF"></div></td>
<th class="form"><label>Location</label></th>
<td><select class="location" name="location">
<option></option>
<cfloop query="rsLocations">
<option value="#rsLocations.optionValue#" <cfif rsRequestSystems.location eq rsLocations.optionValue>selected</cfif> >#rsLocations.optionDesc#</option>
</cfloop>
</select></td>
<td rowspan="2" align="center">
<button type="button" class="fg-button ui-state-default ui-corner-all remove_SystemName" style="width:70px;">Remove</button>
<button type="button" class="fg-button ui-state-default ui-corner-all check_SystemName" style="width:70px;">Check</button></td>
</tr>
<tr>
<th class="form"><label>Platform / Model</label></th>
<td> <select class="platform" name="platform">
<option ></option>
<cfloop query="rsPlatform">
<option value="#rsPlatform.optionValue#" <cfif rsRequestSystems.platform eq rsPlatform.optionValue>selected</cfif>>#rsPlatform.optionValue# - #rsPlatform.optionDesc#</option>
</cfloop>
</select>
/
<select class="model" name="model">
<option selected></option>
<cfloop query="rsModels">
<option value="#rsModels.optionValue#" <cfif rsRequestSystems.model eq rsModels.optionValue>selected</cfif>>#rsModels.optionDesc#</option>
</cfloop></select>some text here</td>
<th class="form" nowrap><label>Estimated Go Live</label></th>
<td><input type="text" name="goLive" class="datepicker goLive" value="#dateformat(rsRequestSystems.golive,'mm/dd/yyyy')#" size="10"></td>
</tr>
</table>
</cfloop>
Этот код работает для моего поля systemname, но не для поля платформы.
thisClicked.closest("tr").find('.systemname').val(data.systemname); //works
thisClicked.closest("tr:odd").find('.platform').val(data.platform); //does NOT work
Я попробовал следующее, но либо сгенерировал сообщение об ошибке, либо дал мне "undefined"
thisClicked.parent().closest("tr:odd").find('.platform').val(data.platform); //does NOT work
thisClicked.parent().child().("tr:odd").find('.platform').val(data.platform); //does NOT work