提交按钮显示是或否[关闭]

I have a form that is used to update a record, at the bottom I have a submit button. I want it to display a messaging saying "Update Record:" and a Yes and No box.

Every way I've found is just for the confirmation popup, but I don't want a popup I want it to be buttons. So currently I have the below which gives me a confirmation popup

<form class=\"searchForm\" action=\"cd_update.php\" method=\"post\" onsubmit=\"return confirm('Are you sure you want to submit?');\">

<button type="submit" id="editButton">Update</button>

Is this possible to do? I'd need it to cd_update.php on the "Yes" and stay on page for the "No"

Thanks

Working fiddle.

You can create new div for confirmation message that will contain the two buttons you want Yes and No, after that add the js code that will show this confirmation div after the user click on Update button.

HTML :

<form class="searchForm" action="cd_update.php" method="post">
    <div id="confirmation-msg" style="display:none">
        Update Record?
        <button type="submit" id="yesButton">Yes</button>
        <button type="button" onClick="$('#confirmation-msg').hide()">No</button>
    </div>

    <button type="button" id="editButton">Update</button>
</form>

JS :

$('#editButton').click(function(){
    $('#confirmation-msg').show();
});

Hope this helps.

I believe this code is what you are looking for. Remove the onsubmit handler if you wish, and swap out the onClick event on the no button to do something else. This will allow those buttons to handle your form without a confirm popup.

        <form class="searchForm" method="post" onsubmit="alert('Record Updated');">

        Update?
        <button type="submit" id="yesButton">Yes</button>
        <button id="noButton" onClick="alert('Not Updated')">No</button>
</form>

You would have to use a modal in order to customize it how you'd like. This can be as simple as doing it yourself (see below) or using a jQuery modal (which is also simple, but may be overkill.

http://jsfiddle.net/m7w0fcmf/1/

Styles

#confirm {
    display:none;
}

HTML

<form id="form" class="searchForm" action="cd_update.php" method="post">

    <div id="confirm">
        Update Record: 
        <button id="yes">Yes</button>
        <button id="no">No</button>
    </div>

    <button type="submit" id="editButton">Update</button>
</form>

JavaScript

document.getElementById('editButton').addEventListener('click', showConfirm);
document.getElementById('no').addEventListener('click', clickNo);

function showConfirm(e) {
    e.preventDefault();
    document.getElementById('confirm').style.display = 'block';
}
function clickNo(e) {
    e.preventDefault();
    document.getElementById('confirm').style.display = 'none';
}