✔ Innerhalb eines Jquery-Ui Dialoges Navigieren

X

xtramen01

Erfahrenes Mitglied
Hallo Leute,

mittlerweile komme ich mit Jquery gut klar.
Allerdings stehe ich nun vor einem Problem.

Ich möchte innerhalb des Jquery Dialoges navigieren.
Also z.b. in einem Textfeld eine Kundennummer eingeben. Wenn die Eingabe erfolgreich war, dann soll es innerhalb des Dialoges weitergehen.

Momentan schließt sich der Dialog immer nach absenden des Formulares.

Hat da jemand einen Ansatz für mich?

Grüße
 
Hi,

du könntest das Formular innerhalb des Dialogs mittels Ajax versenden. War der Request erfolgreich, werden die erforderlichen neuen Inhalte in den Dialog geladen, andernfalls wird der Dialog geschlossen.

Beispiel:
Code: 
<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="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.10/themes/ui-lightness/jquery-ui.css">
<script src="jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="jquery-ui.custom.min.js" type="text/javascript"></script>

<script language="javascript">
<!--
$(function() {
  $( "#dialog" ).dialog();

  $('#innerForm').submit(function(evt){
    evt.preventDefault();
    var $this = $(this);

    $.ajax({
      url: 'request.php',
      type: 'post',
      data: $this.serialize(),
      success: function(msg, textStatus, jqXHR){
        msg = $.trim(msg);

        // Erfolgreich
        if(msg=='1'){
          $('#dialog').html('ERFOLGREICH<br />Hier kommt das nächste Formular');
        }else{
          $('#dialog').dialog('close');
        }
      }
    });
  });
});
-->
</script>
</head>
<body>
<div id="dialog" title="Formular">
  <form id="innerForm" method="post" action="xmlhttp_request_dummy.php">
    <input type="text" value="text input" name="txtTest" /><br />
    <input type="submit" name="cmdSubmit" />
  </form>
</div>
</body>
</html>
Das zugehörige serverseitige Script request.php wertet die Anfrage aus. Ein einfaches Script könnte wie folgt aussehen:
Code: 
// Falls 123 ins Textfeld des Formulars eingegeben wurde
// Hier könnte auch vorher eine Datenbankabfrage erfolgen, in der auf eine Kundennummer geprüft wird
if(isset($_POST['txtTest']) && ($_POST['txtTest']=='123')){
  echo("1");
}else{
  echo("0");
}
Ciao
Quaese
 
Danke Dir, das ist eine Idee!
Mir ist da noch was anderes eingefallen.

Ich könnte ja im Jquery Dialog auch Inline Content verwenden.

Naja ich probiers einfach mal. Danke!

Gruss
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück