Question

I currently have multiple dialogs, but I would like to keep the element ‘name’ just as they are so that I can handle it in one function.

Code:

    <div class="hiddenInViewSource" id="dialog-properties-section" title="Control Properties">
        <div id="tabs-section">
            <ul>
                <li><a href="#tabs-section-basic">Basic</a></li>
            </ul>
            <div id="tabs-section-basic">
                Section Caption <br/><input type="text" name="label" /><br/>
                Section Introduction <br/><input type="text" name="additionalLabel" /><br/><br/>

                <br/><br/>

                <button>Save</button>
                <button>Cancel</button>
            </div>
        </div>
    </div>

    <div class="hiddenInViewSource" id="dialog-properties-simple" title="Control Properties">
        <div id="tabs-simple">
            <ul>
                <li><a href="#tabs-simple-basic">Basic</a></li>
            </ul>
            <div id="tabs-simple-basic">
                simple Caption <br/><input type="text" name="label" /><br/>

                <br/><br/>

                <button>Save</button>
                <button>Cancel</button>
            </div>
        </div>
    </div>

Now I retrieve the values of the label for example with:

 $('[name=label]').val();

But of course, now it does not know from which div it should get it and it returns empty. (as only 1 is filled and it will get the wrong one.)

My question:

How can I retrieve the value from the input from the correct div using the selector?

Answer 1

$('#tabs-simple input[name=label]').val();