Блог

Я создаю массив элементов формы, копируя поле в Javascript. Я не мог использовать идентификаторы, потому что поля генерируются системой.

Что мне нужно, так это способ скопировать выделенный текст из выпадающего списка и вставить его в следующий input box .

Мой Макет:

  (row 1) SELECT | INPUT
 (row 2) SELECT | INPUT
 (row 3) SELECT | INPUT
 

 function updateField(e){    
    var selectElement = e.target.value;
    alert(selectElement); 
    // Got it! works fine
    //If I use an id on the input field, it is the same for ALL <tr>'s. 
    //The following line works almost. But it puts it in the top TR only.
    //That over writes what was there from the TR above.
    document.getElementById("SomeID").value = selectElement;   
    //not gonna work for me  
} 

 <table>
 <tr>   
   <td>
     <select onchange='updateField(event);' name="tom">
        <option value="one">one</option>
        <option value="two">two</option>
     </select>
   </td>
   <td>
     <input name="sue" value="aaa" />
   </td>
 </tr>

 <tr>
   <td>
     <select onchange='updateField(event);' name="tom">
        <option value="one">one</option>
        <option value="two">two</option>
     </select>
   </td>
   <td>
     <input name="sue" value="bbb" />
   </td>
 </tr>
</table> 

Мне нужно записать select box значение и поместить его в поле ввода
того же значения <tr> .

Что мне нужно, так это способ передать полученную информацию в следующее поле формы ( input box ) без использования каких-либо id или class или подобных вещей. Просто просто передайте этот результат в следующее поле формы в следующем td . И это не может иметь id никакого td отношения к , tr , select , или input . Наверняка есть способ захватить следующий элемент управления, не указывая его конкретно??

Когда я вручную вводлю разные сообщения в поля ввода (все они имеют одно и то же имя), я получаю в своем посте именно то, что хочу form !

Результаты публикации PHP:

  $myNumbers = $_POST['sue']; 
 count("$myNumbers") = 1;
 $myNumbers[0] = "aaa";
 $myNumbers[1] = "bbb";
 

Но я не хочу "aaa" или "bbb" (набрано в долинах). Я хочу, чтобы предметы
были выбраны для конкретного rows человека .

Спасибо за вашу помощь! 🙂

Все, что вы хотите сделать, это пересечь дерево DOM от вашего <select> элемента, пока вы не доберетесь до своего <input> .

Один из способов сделать это — использовать метод closest() DOM для получения родителя <td> или родителя <tr> . Оттуда вы можете найти родного брата <td> с помощью nextElementSibling , а затем ввод оттуда или найти ввод от родителя <tr> с помощью querySelector()

 var selectElememt = e.target;
var parentTD = selectElement.closest('td');
var siblingTD = parentTD.nextElementSibling;
var inputElement = siblingTD.querySelector('input');
inputElement.value = selectElement.value;

//using parent tr instead
var selectElememt = e.target;
var parentTR = selectElement.closest('tr');
var inputElement = parentTR.querySelector('input');
inputElement.value = selectElement.value;
 

Если ваша структура в конечном итоге изменится или изменится, например, вы добавите еще <td> один или несколько входных элементов, вам нужно будет изменить способ пересечения дерева DOM, чтобы получить желаемый ввод.