Bug, button disappearing when opening dialog

Question

Bug, button disappearing when opening dialog

Navigation

#1 by (1 votes)

1

function pergunta() {
        $('#form').dialog({
            resizable: false,
            height: 'auto',
            width: 400,
            modal: true,
            title: 'Criar Ticket?',
            buttons: {
                "Confirmar": function () {
                    $(this).dialog("close");
                    obs = prompt('Inserir alguma observação no ticket?');
                    $('<input/>').attr('type', 'hidden')
                            .attr('name', "obs")
                            .attr('value', obs)
                            .appendTo('#form');
                    $("#form").submit();
                },
                "Cancelar": function () {
                    $(this).dialog("close");
                    console.log('cancelado');
                }
            }
        });
    }

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script><scriptsrc="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

<form action="#" id="form" method="post" accept-charset="utf-8">

<button id="ticket" name="obs" onclick="pergunta()" type="button" style="
                border-top-color: transparent;
                border-right-color: transparent;
                border-bottom-color: transparent;
                border-left-color: transparent;
                background-color: transparent;
                cursor: pointer;" title="Criar Ticket no Redmine"><img src="https://cdn3.iconfinder.com/data/icons/fatcow/32x32/ruby_add.png"style="height: 32px" alt=""></button>
                </form>

How do I proceed in this case to make the button stay in the same place!?

javascript

asked by anonymous 23.03.2017 / 20:20

1 answer

HtttpURLConnection nonexistent functions in Xamarin Forms development (Java to C # system conversion) Client / Server / File / Blurry Encryption

score 1 · Accepted Answer

Ideally, you should not do this directly in the form tag.

Create a div so that it can receive the JS value and change the selector.

Follow the code:

$('div').html(""); //limpa a div

$('div').dialog({
  resizable: false,
  height: 'auto',
  width: 400,
  modal: true,
  title: 'Criar Ticket?',
  buttons: {
    "Confirmar": function() {
      $(this).dialog("close");
      obs = prompt('Inserir alguma observação no ticket?');
      $('<input/>').attr('type', 'hidden')
        .attr('name', "obs")
        .attr('value', obs)
        .appendTo('#form');
      $("#form").submit();
    },
    "Cancelar": function() {
      $(this).dialog("close");
      console.log('cancelado');
    }
  }
});

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script><scriptsrc="http://code.jquery.com/ui/1.11.1/jquery-ui.min.js"></script>

<form action="#" id="form" method="post" accept-charset="utf-8">

  <div></div>

  <button id="ticket" name="obs" type="button" style="
            border-top-color: transparent;
            border-right-color: transparent;
            border-bottom-color: transparent;
            border-left-color: transparent;
            background-color: transparent;
            cursor: pointer;" title="Criar Ticket no Redmine"><img       src="https://cdn3.iconfinder.com/data/icons/fatcow/32x32/ruby_add.png"style="height: 32px" alt=""></button>
</form>