Create pop up with bootstrap help

Question

Create pop up with bootstrap help

Navigation

#1 by (1 votes)
#2 by (0 votes)

1

I am creating a "pop up" type pop-up window (as if it were a confirm () but I want instead of having the typical OK-Cancel buttons, have the values: Button1 - Button2, and each do X code. ..

I have the following code in the index.php:

echo "<td onclick='cambiar_estado(this);' width=\"08%\" id=\"".$row['ID_OBLIGATORIO']."\">" ?>
    <!-- Columna ESTADO del usuario. -->
        <center>
         <?php
            $estado = 1;
            echo "<a href='#' data-toggle='modal' data-target='#modal_cambiar_estado' data-id='\"".$row['ID_OBLIGATORIO']."\">' class='cambiar_estado' onclick='cambiar_estado(this);'>";
                echo "<img src=\"/imagenes/".$row['estado'].".gif\">";
            echo "</a>";
         ?>
        </center>
  <?php 
echo "</td>";

Now what I want is a function to load buttons 1-2, do I have to create those botons in Javascript? Or I could do the creation at the same time I created the pop up with the following code:

<button type="button1" class="btn btn-info btn-lg" data-toggle="modal" data-target="#boton1">Boton1</button>

The same for the button2.

javascript html php bootstrap popup

asked by omaza1990 17.11.2016 в 15:17

source

2 answers

How can I "bin" an ObservableCollection to several views and keep it synchronized between them? WPF Arrangement of a structure in binary file

score 1 · Answer 1

So, more than having the problem of invoking the bootstrap modality from php, I think it's using custom actions within the modal.

For that you can use the library Bootbox

Here is an example using four buttons, which we place inside the element buttons and in the callback of each one of them we can program what we want

$("#btn").on("click", function(){
	        mostrar();
	    });

function mostrar(){
    bootbox.dialog({
        message: 'Algún mensaje de ayuda',
        title: "Título",
        keyboard  : true,
        buttons: {
            opUno: {
                label: " Cosa 1",
                className: "btn purple fa fa-calendar",
                callback: function() {
                    alert("Opción 1")
                }
            },
            opDos: {
                label: " Cosa 2",
                className: "btn green fa fa-briefcase",
                callback: function() {
                    alert("Opción 2")
                }
            },
            opTres: {
                label: " Cosa 3",
                className: "btn red fa fa-ban",
                callback: function() {
                    alert("Opción 3")
                }
            },
            opCuatro : {
                label: " Cosa 4",
                className: "btn blue fa fa-edit",
                callback: function() {
                    alert("Opción 4")
                }
            }
        }
    });
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="http://bootboxjs.com/bootbox.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">

<button id="btn">Abrir modal</button>

score 0 · Answer 2

I get the feeling that you are complicating a lot. To qualify, would not it be easier to program it in PHP over HTML and not the other way around?

<?php ?>
<html>
  <body>
    <?php
      if (true) {
    ?>
    
    <p>Este texto se verá si cumple la condición anterior</p>
    
    <?php
      }
    ?>
  </body>
</html>

I would recommend creating a modal or popup in index.php starting the document with <?php ?> and once it works change the HTML body with PHP.