# jquery dialog als bestätigung für Eingabe



## supercat1510 (1. Januar 2011)

Ich will das Jquery Dialog als eine Art Bestätigung verwenden.

Sprich man füllt ein Formular aus, klickt auf Senden, und dann kommt das Dialog Feld das fragt ob man wirklich speichern will.

Mit Klick auf OK soll das ganze dann gespeichert werden und auf eine andere Seite weiterleiten.

Allerdings verstehe ich bisher noch nicht ganz wie ich dem Button "OK" das zuweisen soll das er ein PHP-Script ausführt und dann weiterleitet.

[Edit:] Hab die eine Hälfte jetzt mit einem versteckten Formular gemacht das in dem Div für den Dialog eingeschlossen ist, jetzt brauch ich nur noch das absenden eines Formulars über den "OK" button.


```
$('#dialog').dialog({
		buttons: {
			"Ok": function() {
				$(this).dialog("close");
			},
			"Cancel": function() {
				$(this).dialog("close");
			}
		}
	});
```


----------



## Quaese (2. Januar 2011)

Hi,

überwach das *submit*-Ereignis des Formulars, das gesendet werden soll. Tritt es ein, unterbindest du das Senden und blendest stattdessen den Dialog ein. Wird dort *OK* gedrückt, löst du das Absenden durch die *submit*-Methode aus.

Beispiel:

```
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>www.tutorials.de</title>
<meta name="author" content="Quaese">
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="jquery-ui-1.8.7.custom.css">
<style type="text/css">
  <!--
#dialog{
  display: none;
}
 //-->
</style>
<script src="jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="jquery-ui-1.8.7.custom.min.js" type="text/javascript"></script>
<script type="text/javascript">
  <!--
$(function(){
  $('#form_id').bind('submit', function(evt){
    $form = this;
    evt.preventDefault();

    $("#dialog").dialog({
      buttons: {
        'OK': function(){
          $form.submit();
          $(this).dialog("close");
        },
        'Abbrechen': function(){
          $(this).dialog("close");
        }
      }
    });
  });
});
 //-->
</script>
</head>
<body>
<div id="dialog" title="Speichern">
  <p>Speichern?</p>
</div>

<form id="form_id" method="post" action="get_formdata.php">
  <input type="hidden" name="hiddenText" value="Versteckt">
  <input type="text" name="txtText" value="Sichtbar"><br>
  <input type="submit" value="senden">
</form>
</body>
</html>
```
Ciao
Quaese


----------



## supercat1510 (2. Januar 2011)

Habs jetzt mal eingebaut - Dialog wird schön geöffnet beim Klick auf Submit, aber beim Klick auf "OK" passiert nichts.

Edit: Nommal rumprobiert und jetzt gehts - musste iwie id und name aus dem submit rausnehmen.


----------

