[SalesForce] document.getElementById().value not working for in lightning component</h1> </header> <div class="entry-content"> <p>I have a lightning component which acts as a text area field. The mark up is as given below.</p> <pre><code><aura:component implements="force:appHostable,flexipage:availableForAllPageTypes"> <aura:attribute name="Label" type="String" /> <aura:attribute name="fID" type="String" /> <div class="slds-form-element"> <label class="slds-form-element__label" for="{!v.itemID}">{!v.Label}</label> <textarea id="{!v.fID}" class="slds-textarea" rows="3" /> </div> </aura:component> </code></pre> <p>I am using this component in a parent form component. On click of a button from there I am fetching the values from inside all such child components which act as different field types using <code>document.getElementById().value</code>. It works for all <code><input></code> type tags but returns the value as undefined for the <code><textarea></code> tag.</p> <p>Any suggestions regarding tackling such a scenario?</p> </div> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8728145350222960" data-ad-slot="1638840875" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <div id="comments" class="comments-area"> <div class="row"> <div class="col-12"> <div class="mt-3 border-bottom border-success"> <h4 class="text-success"><i class='fa fa-check-circle text-success mr-3'></i><span>Best Answer</span></h4> </div> <div class='bg-transparent mb-3'> <p>The <code>value</code> property of <code>textarea</code> has just been whitelisted and should be available next week.</p> </div> </div> <div class="col-4"></div> </div> </div> <div id="related-embeded" class="related-embeded-area"><div class="row"><div class="col-12"><div class="mt-3 border-bottom border-success"><h4 class="text-info"><i class='fa fa-check-circle text-info mr-3'></i><span>Related Solutions</span></h4></div><div class="mt-3 mb-3 border-bottom"><h5><a href='https://life-improver.com/salesforce/salesforce-undefined-value-for-textarea-in-lightning-component/'>[SalesForce] Undefined value for TextArea in Lightning component</a></h5></div><div class='bg-transparent mb-3'> <p>I suspect that this is a bug in LockerService (the .value attribute not being properly exposed in the secure virtual DOM). Have you opened a case with Salesforce support on this yet?</p> </div><div class="mt-3 mb-3 border-bottom"><h5><a href='https://life-improver.com/salesforce/salesforce-unable-to-get-textarea-value-with-lockerservice/'>[SalesForce] Unable to get textarea value with LockerService</a></h5></div><div class='bg-transparent mb-3'> <p>The <code>value</code> property of <code>textarea</code> has just been whitelisted and should be available next week.</p> </div></div></div></div> </div> <div class="col-12 col-md-4"> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8728145350222960" data-ad-slot="4237084052" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> <div class='mt-3 ml-4 border-bottom border-success'><h6><span>Related Topic</span></h6></div><ul class='list-group list-group-flush'><li class="list-group-item"><a href='https://life-improver.com/salesforce/salesforce-document-getelementbyidsomeid-not-working-with-locker-service/'>[SalesForce] document.getElementById(‘someid’) not working with locker service</a></li><li class="list-group-item"><a href='https://life-improver.com/salesforce/salesforce-document-getelementbyidsomething-value-not-working-for-with-not-working-after-locker-service-enabled/'>[SalesForce] document.getElementById(“something”).value not working for <Select> with <option> not working after Locker Service enabled</a></li><li class="list-group-item"><a href='https://life-improver.com/salesforce/salesforce-document-getelementbyidtheid-getcomputedtextlength-is-not-a-function/'>[SalesForce] document.getElementById(“theID”).getComputedTextLength() is not a function</a></li><li class="list-group-item"><a href='https://life-improver.com/salesforce/salesforce-draggabletrue-is-not-working-in-firefox-for-lightning-component/'>[SalesForce] draggable=”true” is not working in firefox for Lightning Component</a></li><li class="list-group-item"><a href='https://life-improver.com/salesforce/salesforce-fullcalendar-v4-is-not-working-in-lightning-component/'>[SalesForce] FullCalendar V4 is not working in lightning component</a></li></ul> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8728145350222960" data-ad-slot="8970621700" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> </div> <footer class="entry-footer"> </footer> </article> </div> </div> </div> </main> </div> </div> <footer id="colophon" class="site-footer"> <div class="site-info"> </div> </footer> </div> <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/esm/popper.min.js?ver=1.14.7' id='popper-js'></script> <script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js?ver=4.3.1' id='bootstrap4-js'></script> </body> </html>