0

My Bootstrap 3 edit form had initially only a Submit button that worked perfectly. When I added another button to implement a 'Cancel' option, it didn't work as expected, and a click on it is submitting the form (and saving changes). Of course I didn't mark this second button as 'Submit', not being intended for that.

My HTML/PHP code looks like this:

<form method='POST' action='savechanges.php'>
    <div class="form-group">
        <label for="IdDataList">List Id</label>
        <input type="text" class="form-control" id="IdDataList" readonly value="<?php echo $row['IdDataList']; ?>">
    </div>
    <div class="form-group">
        <label for="DataListName">List Name</label>
        <input type="text" class="form-control" id="DataListName" name="DataListName" value="<?php echo $row['DataListName']; ?>">
    </div>
    <div class="form-group">
        <label for="DataListDescription">Description</label>
        <input type="text" class="form-control" id="DataListDescription" name="DataListDescription" value="<?php echo $row['DataListDescription']; ?>">
    </div>

<!-- Submit button -->
    <div class="form-group col-sm">
    <button class="btn btn-primary" name="saveall" type="submit" >Save changes</button>
    </div>

<!-- Here the second 'Cancel' button -->
    <div class="form-group col-sm">
    <button class="btn btn-primary" name="goback" onclick="window.location.href='anotherpage.php'">Cancel</button>
    </div>
</form>

Must be something obvious but I can't see what's going wrong... Thanks in advance!

ManuelJE
  • 496
  • 6
  • 15
  • 2
    if button is causing the issue you can give the button type as `type="button"` or use `a` tag their. you can check here https://stackoverflow.com/questions/31644723/what-is-the-default-button-type as default button type is submit – Chilll007 Jan 21 '19 at 11:20
  • Thanks, @Chilll007 that was the problem, similar question found here too: https://stackoverflow.com/questions/932653/how-to-prevent-buttons-from-submitting-forms Most browsers use 'submit' if the type is not specified. – ManuelJE Jan 21 '19 at 11:27
  • glad to know that it solves the issue :) – Chilll007 Jan 21 '19 at 11:59

1 Answers1

-1

Credit for this answer goes to @Chilll007, as I decided to close this question myself.
The current HTML standard, as adopted by most browsers, states that the type attribute should be used to differentiate the button's behavior, defaulting to 'submit' type.

Buttons that don't serve to this purpose should be marked as generic with type='button'. To get hyperlink behavior you can define actions through Javascript or with an <a href=''></a> tag:

<a href="anotherpage.php"class="btn btn-primary" name="back" role="button">Cancel</a>
ManuelJE
  • 496
  • 6
  • 15
  • 1
    `a` tags **cannot have interactive children** like `button` or `label`. The HTML you suggest is invalid. – connexo Jan 21 '19 at 13:38
  • Absolutely right! I must have pasted that code from another answer (and that worked :), I corrected the code as suggested. – ManuelJE Jan 31 '19 at 10:30