i need to get the id of a input that's inside a span of a sharepoint list. it looks like the code below.

<tr id="idEstablishmentRow">
<td class="ms-formbody" vAlign="top">
<span dir="none">
<span style="vertical-align: middle;">
<input type='text' id='hello' />
</span>
</span>
</td>
</tr>

now i want to get the id of the input. i have tried:

    var _test = $('#idEstablishmentRow').find('td.ms-formbody');
    var _test1 = _test.find('span.style');

    var _test2 = _test1.find('input');
    var _test3 = _test2.attr('id');
    alert(_test3);
    alert(_test2);

but it didn't work. could anyone help me ?

i need to get the id of a input that's inside a span of a sharepoint list. it looks like the code below.

<tr id="idEstablishmentRow">
<td class="ms-formbody" vAlign="top">
<span dir="none">
<span style="vertical-align: middle;">
<input type='text' id='hello' />
</span>
</span>
</td>
</tr>

now i want to get the id of the input. i have tried:

    var _test = $('#idEstablishmentRow').find('td.ms-formbody');
    var _test1 = _test.find('span.style');

    var _test2 = _test1.find('input');
    var _test3 = _test2.attr('id');
    alert(_test3);
    alert(_test2);

but it didn't work. could anyone help me ?

• javascript
• jquery
• sharepoint

3 Answers 3

You might want this :

var id = $('#idEstablishmentRow td.ms-formbody span input').attr('id');

But as your HTML doesn't have any element whose id is idEstablishmentRow, it's hard to be sure of what you exactly want.

Demonstration

var inputId = $("span input").attr("id");

Your snippet does not work because of this selector : var _test1 = _test.find('span.style');

When doing this, you try to find a span with the css class "style" not the html attribute style. And thus _test1 is empty.

You can do the following to fix it : var _test1 = _test.find('span[style]');

Though its not really a good selector, because it is most likely going to break if you change the css to remove it from inline.

• You could add a class to the span <span class="aclass"></span>. And this way you can select it by the following selector : var _test1 = _test.find('span.aclass');

• You could also select it in other ways like var _test1 = _test.find('span:nth-child(2)'); if it's always the second child.

These are only two of the multiple possible solutions to go with your _test2 and _test3

• You can also try to select all spans with inputs in it with var _test1 = _test.find('span input'); or _test.find('span').children('input'). Then you can do your _test3.

Note that you can regroup the selector in 1 line :

This has the advantage of not having to put a class on the span since you actually not only query for the span but for a span WITH an input in it.

$('tr#idEstablishmentRow td.ms-formbody span input');

//or to get the id directly
$('tr#idEstablishmentRow td.ms-formbody span input').attr('id');