Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

zxywvu's avatar

How to add just one?

I want to add dynamic just one. How to do it?

HTML

<a class="btn btn-lg btn-secondary me-2" id="addDelay">Delay</a>
<div id="showDamage" class="row">

</div>

SCRI|PT

<script>
    jQuery(function() {
        $(document).ready(function(){
            let count = 1;
            $('#addNotDoing').click(function () {
                count++;
                addNotDoing(count);
            });
            function addNotDoing(number) {
                let html = `<div class="col-lg-6 mb-3">
                    <fieldset class="border p-2">
                        <legend class="float-none w-auto p-2 h6 fs-6">damages_non_performance</legend>
                        <textarea name="parties[`+ number +`][damages_non_performance][]" id="damages_non_performance" class="form-control border-0" rows="10" aria-label="damages_non_performance"></textarea>
                        <a class="cursor-pointer text-secondary"><i class="fa-solid fa-2x fa-trash"></i></a>
                    </fieldset>
                </div>`;
                $('#showDamage').append(html);
            }
0 likes
16 replies
tykus's avatar

How does that HTML relate to the JavaScript?

zxywvu's avatar

@tykus How to make a bet that if one of these is added, it will not be added again? only one add it.

Sinnbeck's avatar
Sinnbeck
Best Answer
Level 102

@zxywvu Try this. It only triggers once and also disabled the button

            $('#addNotDoing').one('click', function () {
                $(this).prop('disabled', true);
                count++;
1 like
zxywvu's avatar

@Sinnbeck I tested it. But after saving the form, The #addNotDoing is enabled again.

Sinnbeck's avatar

@zxywvu yes if your form refreshes the page. Then you will need to set it to disabled with blade.. Or even better just redirect away as they don't need to see the page as they can do nothing with it i assume

Sinnbeck's avatar

@zxywvu so you still want to show the form even though it has already been saved?

Show the buttons html

zxywvu's avatar

@Sinnbeck

<a class="btn btn-lg btn-secondary me-2" id="addDelay">Delay</a>
Sinnbeck's avatar

@zxywvu ok not sure why you are using an a tag instead of a button? You cannot disable an a tag. So change it to a button or hide it completely

Here we add the disabled property if $hasBeenSaved is true. So send a variable like that to the view

<button class="btn btn-lg btn-secondary me-2" 
{{$hasBeenSaved ? 'disabled' : ''}}
id="addDelay">Delay</button>
Sinnbeck's avatar

@zxywvu whatever determines that the form has already been saved. You can check the database for that, but as I have only seen some Javascript, I cannot tell you how to check that currently. Maybe if I knew what you saved

Tray2's avatar

@zxywvu Use ajax to submit the form, then you won't need to check in the database if whatever has been done and the button would stay disabled.

Please or to participate in this conversation.