Button Not Functioning in jQuery Function

Question

I am working to add an additional button to call a jQuery function. The HTML code currently looks like this

<div id="tabs" class="col-xs-4 col-md-3">
    <ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active">
    <a href="#regions" aria-controls="regions" role="tab" data-toggle="tab">Regions</a>
    </li>
    <li role="presentation">
    <a href="#computations" aria-controls="computations" role="tab" data-toggle="tab">Computations</a>
    </li>
    <li role="presentation">
    <a href="#multicycle" aria-controls="multicycle" role="tab" data-toggle="tab">Multi-Cycle Regions</a>
    </li>
</ul>
<div class="tab-content">
    <div role="tabpanel" class="tab-pane fade in active" id="regions">
        <div class="row" style="margin-left: 2%; margin-right: 2%;">
        <button id="import-regions" class="btn btn-default col-md-5 mobile-device" disabled>Import Regions</button>
        <div class="col-md-2"></div>
        <button id="clear-regions" class="btn btn-danger col-md-5 mobile-device hidden">Clear Regions</button>
        </div>
        <ul id="region-list" class="list-group">
        </ul>
    </div>
<div role="tabpanel" class="tab-pane fade" id="multicycle">
    <div class="row" style="margin-left: 2%; margin-right: 2%;">
        <div class="col-md-10">
            <h4>Draw Multi-cycle Regions</h4>
            Draw multi-cycle regions by pressing start, drawing multiple regions and then pressing stop
        </div>
        <button id="start-multi" class="btn btn-default col-md-5 mobile-device">Start</button>
        <div class="col-md-2"></div>
        <button id="clear-regions" class="btn btn-default col-md-5 mobile-device">Stop</button>
    </div>
</div>

In this example, the initial button with the ID of clear-regions works properly. The second clear-region button doesn't seem to properly call the jQuery function. (To test the second button, I set the ID to clear-regions for testing since I knew that that function worked correctly.) I have moved the second button to multiple locations in the code, and experimented with different IDs to what may be causing this error but have not found anything. Is there anything obvious I am overlooking here? Thanks!

laiju · Accepted Answer · 2017-11-29 05:29:07Z

1

id must be unique. either add clear-regions as class for both the buttons or add a different id to the second clear-regions button

answered Nov 29, 2017 at 5:29

laiju

1,38310 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user3068177 Over a year ago

Thanks, that was it. I eliminated the first button and the second one works properly now.

Collectives™ on Stack Overflow

Button Not Functioning in jQuery Function

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related