Skip to content

bootbox.confirm - php form with 4 submit buttons #853

@marcoczen

Description

@marcoczen

Guys,

Background :

I have succesfully used bootbox.confirm to replace
the default javascript confirm in a single php/html form ( with single submit button )
with help from a forum member here.

Now :

I have a single form ( php + html ) ( as above ) but however with 4 submit buttons.

: The php/html form code is a below ( with 4 submit buttons ) :

  <form  id="pageForm1" class="" action="user.php?goto=info_view"  method="post"
         enctype="application/x-www-form-urlencoded" accept-charset="utf-8"  >

      <!-- many     input fields -->

      <div class="row">

           <div class="col-12 text-center">

                <button type="submit" class="btn" id="button_submit1" name="viewSingleContractor"        
                        title="View Info" >View Info</button>

                <button type="submit" class="btn" id="button_submit2" name="editSingleContractor"        
                        title="Edit Info" >Edit Info</button>

                <button type="submit" class="btn" id="button_submit3" name="delSingleContractor"              
                        title="Delete Info" >Delete Info</button>

                <button type="submit" class="btn" id="button_submit4" name="resetPwdSingleContractor"    
                        title="Reset Password" >Reset Passwd</button>


          </div>

      </div>

  </form> ``

: The JS Code ( how do I modify bootbox.confirm to work with 4 submit buttons ) is as below :

document.addEventListener('DOMContentLoaded', function () {

      let formHandled1 = false;

      const form1 = document.getElementById('pageForm1');
      const btn1  = document.getElementById('button_submit1');
      const btn2  = document.getElementById('button_submit2');
      const btn3  = document.getElementById('button_submit3');
      const btn4  = document.getElementById('button_submit4');

      if( form1 ){

          form1.addEventListener('submit', event  => {

              if( !formHandled1 ) {
                  event.preventDefault();

                  bootbox.confirm({
                      size: 'small', centerVertical: true,
                      message: 'Proceed With Action?',
                      callback : function(result) {
                          if( result ) {

                              formHandled1 = true;

                              if ( btn1  ){
                                   
                                   btn1.click();

                              } else if ( btn2  ){
                                   
                                   btn2.click();

                              } else if ( btn3 ){

                                   btn3.click();

                              } else if ( btn4  ){

                                   btn4.click();

                              }   
                             
                          } else {

                              formHandled1 = false;

                          }
                      }
                  }); // end bootbox.confirm

                  return false;

              }// end of if( !formHandled1 )

          }); //end of form1.addEventListener

      } // end of if form1



    });
    // end document DOMContentLoaded

Question :

How do I get 4 submit buttons( only 1 button will be used at a time ) to work with bootbox.confirm ?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions