Home/ Questions/Q 6532803
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T10:02:56+00:00

I have a form with multi-value fieldset with each field wrapper and interior divs

  • 0

I have a form with multi-value fieldset with each field wrapper and interior divs set with id incrementing by 1 number to differentiate the id’s. If the checkbox is checked for the checkbox form item within an individual field set, I need to hide the divs that wrap the form items that follow within that field set. A problem that I’m running into is that the name of the id’s contain a unique value within the middle of the string. Example: “#beginningofIDSting-X-endofStringName”. I can’t change the ID or add classes to the wrappers.

<div id="edit-field-gallery-images-0-ahah-wrapper">
<div id="edit-field-gallery-images-0-data-revise-wrapper" class="form-item">
<label class="option" for="edit-field-gallery-images-0-data-revise">
<input id="edit-field-gallery-images-0-data-revise" 
class="form-checkbox revise-check" 
type="checkbox" checked="checked" 
value="1" name="field_gallery_images[0][data][revise]">
Revise This Description
</label>
</div>

<div id="edit-field-gallery-images-0-data-revisedby-wrapper" class="form-item">
//Stuff in Here
</div>

<div id="edit-field-gallery-images-0-data-revisedon-wrapper" class="form-item">
//Stuff in Here
</div>
</div>//End #edit-field-gallery-images-0-data-revisedby-wrapper

<div id="edit-field-gallery-images-1-ahah-wrapper">
<div id="edit-field-gallery-images-1-data-revise-wrapper" class="form-item">
<label class="option" for="edit-field-gallery-images-1-data-revise">
<input id="edit-field-gallery-images-1-data-revise" 
class="form-checkbox revise-check" 
type="checkbox" checked="checked" 
value="0" name="field_gallery_images[1][data][revise]">
Revise This Description
</label>
</div>
//Stuff in Here
</div>

 <div id="edit-field-gallery-images-1-data-revisedby-wrapper" class="form-item">
<div id="edit-field-gallery-images-1-data-revisedon-wrapper" class="form-item">
//Stuff in Here
</div>
</div>//End #edit-field-gallery-images-1-data-revisedby-wrapper

Here’s my jquery

$("input[type='checkbox'][id$='-data-revise']:checked").each(function(){

    $(this).next("[id$=-data-revisedby-wrapper]").hide();   
    $(this).find("[id$=-data-revisedon-wrapper]").hide();   


 });

I used a comination of jfriend00’s and user625037’s solutions. Here it is:

 $("div[id$=data-revisedby-wrapper]").hide();
  $("div[id$=data-revisedon-wrapper]").hide();

$("input[id^=edit-field-gallery-images]:checked").each(function() {
    var startPos = "edit-field-gallery-images-".length;
    var endPos = this.id.indexOf("-", startPos);
    var id = this.id.substring(startPos, endPos);

        $("div[id$="+id+"-data-revisedby-wrapper]").show();
        $("div[id$="+id+"-data-revisedon-wrapper]").show();



});


$(".revise-check").change(function() {
     if(this.checked) {
    $("#" + this.id + "by-wrapper").fadeIn();
    $("#" + this.id + "on-wrapper").fadeIn();
     }
     else{  
     $("#" + this.id + "by-wrapper").fadeOut();
    $("#" + this.id + "on-wrapper").fadeOut();
         }
});
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    bind click event for input that have id start with edit-field-gallery-images and extract id from the id of the input object. quick sample code:

    // bind click event for input with id start with edit-field-gallery-images
$("input[id^=edit-field-gallery-images]").click(function() {
    var startPos = "edit-field-gallery-images-".length;
    var endPos = this.id.indexOf("-", startPos);
    var id = this.id.substring(startPos, endPos);
    if(this.checked) {
        $("#edit-field-gallery-images-" + id + "-ahah-wrapper").show();
    }
    else {
        $("#edit-field-gallery-images-" + id + "-ahah-wrapper").hide();
    }
});
    • 0