hide parent div based on partial name id of child

jquery find hidden element
jquery not hidden
jquery display:none
css visibility
css visible selector
jquery select hidden input
hide text css
onclick show div and hide other div

I wish to hide the parent div class "field" when his child is a textarea

var child = document.querySelector('[id^=booked-textarea-paragraph-text-]').id;
var parent = child.parents('div');

console.log(child);
console.log(parent);
<div class="field">
<label class="field-label">Remarque éventuelle :</label>
<br/>
<textarea id="booked-textarea-paragraph-text-label---3501121" data-calendar-id="19" name="paragraph-text-label---3501121"></textarea>
</div>

Your JS code seems rather confused. For example, this will be a reference to the window, not any specific element as it seems to expect. Also, child will be a string, so calling parents() on it will not work.

If you're happy to use jQuery, then you can solve this in one line using :has to select the element which has a textarea child, and hide().

$('.field:has(textarea)').hide();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="field">
  <label class="field-label">Remarque éventuelle :</label><br/>
  <textarea id="booked-textarea-paragraph-text-label---3501121" data-calendar-id="19" name="paragraph-text-label---3501121"></textarea>
</div>

javascript - hide parent div based on partial name id of child, Your JS code seems rather confused. For example, this will be a reference to the window , not any specific element as it seems to expect. Also  I was thinking it more as meta-data being passed to the parent where the parent can make use of it - the PartialView wouldn't complain if that data isn't used so it still is generally independent and reusable - just with added sugar if the parent can make use of it.

Try this code

$("textarea[name='paragraph-text-label---3501121']").closest("div.field").css("display", "none"); // it is not good practice to use name like this. "paragraph-3501121" this could be better one

:hidden Selector, 2. An element is assumed to be hidden if it or any of its parents consumes no space in the document. CSS visibility isn't taken into account (  Finding the id of a parent div using Jquery. so I could determine buttonNo based on the id of the parent div. In real life there are multiple sections looking

Whit plain javascript you may use something like this, try it and see if it can help you

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
 </script>

 <div class="field">
    <label class="field-label">Remarque éventuelle :</label><br/>
    <textarea id="booked-textarea-paragraph-text-label---3501121" data-calendar- 
     id="19" name="paragraph-text-label---3501121"></textarea>
    <br>
    <button id="button">Hide this</button>
 </div>
 <script type="text/javascript">
   let child    =document.getElementById("booked-textarea-paragraph-text-label-- 
   -3501121");
    let parent  =child.parentNode;
    let button =document.getElementById("button");
    button.addEventListener("click",function({
       parent.style.display ="none";
    })
 </script>

10 Ways to Hide Elements in CSS, In this example, an ::after pseudo-element is overlaid, although any child element could be used: HTML; CSS; JS. Result. Nice article, I personally don’t need parent selectors. And if it brings performance issues I think it’s not supposed to be in the spec. But hey, if you Chris CSS guru can come up with some scenario where parent selectors are making things so much easier.

Document.getElementsByClassName(), getElementsByClassName( names ); // or: var elements = rootElement . <html> <body> <div id="parent-id"> <p>hello world 1</p> <p  Home › ASP.NET › Partial Views and Child Actions in ASP.NET MVC. Partial Views and Child Actions in ASP.NET MVC By Christos S. on May 7, 2013 • ( 10). It’s common sense for Web Applications to make use of same code over and over again to display/render information and details for their domain objects.

Element.querySelector(), Notice how the "div span" selector still successfully matches the <span> element, even though the baseElement 's child nodes do not include the  CSS-Tricks * is created, written by, and maintained by Chris Coyier and a team of swell people. The tech stack for this site is fairly boring. That's a good thing! I've used WordPress since day one all the way up to v17, a decision I'm very happy with. I also leverage Jetpack for extra functionality and Local for local development.

Get parent div jquery, Note: jQuery UI does not support positioning hidden elements. The index returned by jQuery is zero based so I've put text into the <div>s noting the index This method takes in as argument the name attribute value of elements to be retrieved In this post, I will tell you, Get multi-child parent div id jquery - jQuery trick 1. p  The element>element selector is used to select elements with a specific parent. Note: Elements that are not directly a child of the specified parent, are not selected. Version:

Comments
  • there is no parent li element. Please provide it in the question so the snipped might work.