jquery UI Modal alert 2

Κώδικας, πληροφορίες, ερωτήσεις και απαντήσεις σχετικές με την JavaScript.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
mpempe
Δημοσιεύσεις: 156
Εγγραφή: 23 Ιουν 2003 02:48
Τοποθεσία: peloponisos

jquery UI Modal alert 2

Δημοσίευση από mpempe » 27 Απρ 2012 17:45

Γεια σας.
Σε συνέχεια ενός προηγούμενου post σε σχέση με τον έλεγχο μέσω jquery UI των checkbox μιας φόρμας. Επανέρχομαι με μια ακόμη ερώτηση.

Έχω μια φόρμα με δύο πεδία.
Μέσω jquery UI ελέγχω αν το πεδίο 1 είναι άδειο ή όχι.
Προσπαθώ να ελέγξω και το δεύτερο πεδίο χωρίς επιτυχία.

Please help.

Εικόνα

Ο Κώδικας

Κώδικας: Επιλογή όλων

<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1253">
<link rel="stylesheet" href="http&#58;//ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/base/jquery-ui.css" type="text/css" media="all" />
<script src="http&#58;//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="http&#58;//ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js"></script>
	
<script type="text/javascript">
$&#40;document&#41;.ready&#40;function &#40;&#41; &#123;
   
   var $dialog = $&#40;'<div></div>'&#41;
      .html&#40;'Το πεδίο 1 είναι κενό'&#41;
      .dialog&#40;&#123;
         resizable &#58; false,
         height &#58; 140,
         modal &#58; true,
         autoOpen &#58; false,
         title &#58; 'Προσοχή!!!',
         buttons &#58; &#123;
            "κλείσιμο" &#58; function &#40;&#41; &#123;
               $&#40;this&#41;.dialog&#40;"close"&#41;;
            &#125;
         &#125;
      &#125;&#41;;
   $&#40;'#opener'&#41;.click&#40;function &#40;&#41; &#123;
	  if &#40;$&#40;'input&#91;name="customer1"&#93;'&#41;.val&#40;&#41; != ""&#41; &#123;
		 $&#40;'#customers'&#41;.submit&#40;&#41;; 
      &#125; else &#123;
         $dialog.dialog&#40;'open'&#41;;
         return false;
	 &#125;
   &#125;&#41;;

&#125;&#41;; 
</script>
<style>
	body &#123; font&#58;62.5% Verdana, Arial, sans-serif; &#125;
</style>
</head>


<body>

<form name="customers" id="customers" method="post">
	<label>πεδίο 1</label><input type="text" name="customer1" value="">
	<br />
	<label>πεδίο 2</label><input type="text" name="customer2" value="">
	
	<input id="opener" type="submit" value="Submit" /><br />
</form>

</body>
</html>
Συνημμένα
1.jpg
1.jpg (11.62 KiB) Προβλήθηκε 1544 φορές

mpempe
Δημοσιεύσεις: 156
Εγγραφή: 23 Ιουν 2003 02:48
Τοποθεσία: peloponisos

jquery UI Modal alert 2

Δημοσίευση από mpempe » 27 Απρ 2012 21:28


alou
Script Master
Δημοσιεύσεις: 1374
Εγγραφή: 24 Αύγ 2007 19:52
Επικοινωνία:

jquery UI Modal alert 2

Δημοσίευση από alou » 28 Απρ 2012 02:05

Απλά προσθέτεις και την άλλη περίπτωση στο conditional:

Κώδικας: Επιλογή όλων

$&#40;'#opener'&#41;.click&#40;function &#40;&#41; &#123;
     if &#40;&#40;$&#40;'input&#91;name="customer1"&#93;'&#41;.val&#40;&#41; != ""&#41; && $&#40;'input&#91;name="customer2"&#93;'&#41;.val&#40;&#41; != ""&#41;&#41; &#123;
       $&#40;'#customers'&#41;.submit&#40;&#41;;
      &#125; else &#123;
         $dialog.dialog&#40;'open'&#41;;
         return false;
    &#125;
   &#125;&#41;; 

Cretan1986
Δημοσιεύσεις: 79
Εγγραφή: 14 Απρ 2012 13:57

jquery UI Modal alert 2

Δημοσίευση από Cretan1986 » 29 Απρ 2012 13:35

σωστός ο alou, απλά ξέχασε μία παρένθεση

Κώδικας: Επιλογή όλων

if &#40;&#40;$&#40;'input&#91;name="customer1"&#93;'&#41;.val&#40;&#41; != ""&#41; && &#40;$&#40;'input&#91;name="customer2"&#93;'&#41;.val&#40;&#41; != ""&#41;&#41;
http://jsfiddle.net/WWVEg/28/

mpempe
Δημοσιεύσεις: 156
Εγγραφή: 23 Ιουν 2003 02:48
Τοποθεσία: peloponisos

jquery UI Modal alert 2

Δημοσίευση από mpempe » 29 Απρ 2012 20:21

Μπράβο αυτό είναι σας ευχαριστώ.
Γίνεται να έχουμε διαφορετικά μηνύματα λάθους?

alou
Script Master
Δημοσιεύσεις: 1374
Εγγραφή: 24 Αύγ 2007 19:52
Επικοινωνία:

jquery UI Modal alert 2

Δημοσίευση από alou » 30 Απρ 2012 00:41

Πρέπει να αλλάξεις λίγο την προσέγγιση

Κώδικας: Επιλογή όλων

$&#40;document&#41;.ready&#40;function &#40;&#41; &#123;
   
   var $dialog = $&#40;'<div></div>'&#41;
      .html&#40;'Το πεδίο 1 είναι κενό'&#41;
      .dialog&#40;&#123;
         resizable &#58; false,
         height &#58; 140,
         modal &#58; true,
         autoOpen &#58; false,
         title &#58; 'Προσοχή!!!',
         buttons &#58; &#123;
            "κλείσιμο" &#58; function &#40;&#41; &#123;
               $&#40;this&#41;.dialog&#40;"close"&#41;;
            &#125;
         &#125;
      &#125;&#41;;
    
    var $dialog2 = $&#40;'<div></div>'&#41;
      .html&#40;'Το πεδίο 2 είναι κενό'&#41;
      .dialog&#40;&#123;
         resizable &#58; false,
         height &#58; 140,
         modal &#58; true,
         autoOpen &#58; false,
         title &#58; 'Προσοχή!!!',
         buttons &#58; &#123;
            "κλείσιμο" &#58; function &#40;&#41; &#123;
               $&#40;this&#41;.dialog&#40;"close"&#41;;
            &#125;
         &#125;
      &#125;&#41;;
    var $dialog3 = $&#40;'<div></div>'&#41;
      .html&#40;'Το πεδίο 1 και το πεδίο 2 είναι κενά'&#41;
      .dialog&#40;&#123;
         resizable &#58; false,
         height &#58; 140,
         modal &#58; true,
         autoOpen &#58; false,
         title &#58; 'Προσοχή!!!',
         buttons &#58; &#123;
            "κλείσιμο" &#58; function &#40;&#41; &#123;
               $&#40;this&#41;.dialog&#40;"close"&#41;;
            &#125;
         &#125;
      &#125;&#41;;
   $&#40;'#opener'&#41;.click&#40;function &#40;&#41; &#123;
       if &#40;$&#40;'input&#91;name="customer1"&#93;'&#41;.val&#40;&#41; == ""&#41; &#123;
           if &#40;$&#40;'input&#91;name="customer2"&#93;'&#41;.val&#40;&#41; == ""&#41; &#123;
               $dialog3.dialog&#40;'open'&#41;;
               return false;
           &#125; else &#123;
               $dialog.dialog&#40;'open'&#41;;
               return false;
                  &#125;
       &#125; else if &#40;$&#40;'input&#91;name="customer2"&#93;'&#41;.val&#40;&#41; == ""&#41; &#123;
           $dialog2.dialog&#40;'open'&#41;;
           return false;
       &#125; else &#123;
         $&#40;'#customers'&#41;.submit&#40;&#41;;
     &#125;
   &#125;&#41;;

&#125;&#41;; 


mpempe
Δημοσιεύσεις: 156
Εγγραφή: 23 Ιουν 2003 02:48
Τοποθεσία: peloponisos

jquery UI Modal alert 2

Δημοσίευση από mpempe » 01 Μάιος 2012 18:40

alou χίλια ευχαριστώ

mpempe
Δημοσιεύσεις: 156
Εγγραφή: 23 Ιουν 2003 02:48
Τοποθεσία: peloponisos

jquery UI Modal alert 2

Δημοσίευση από mpempe » 01 Μάιος 2012 19:32

alou
Θα μπορούσε να γίνει κάπως έτσι?
http://jsfiddle.net/WWVEg/37/

Δηλαδή να έχω μόνο ένα dialog και να καθορίζω το μήνυμα με τη μεταβλητή prefixMessage?

alou
Script Master
Δημοσιεύσεις: 1374
Εγγραφή: 24 Αύγ 2007 19:52
Επικοινωνία:

jquery UI Modal alert 2

Δημοσίευση από alou » 02 Μάιος 2012 14:02

Ναι αλλά πρέπει να βάλεις το dialog σε ένα function και να στέλνεις κάθε φορά τη μεταβλητή, δηλαδή έτσι:

Κώδικας: Επιλογή όλων

$&#40;document&#41;.ready&#40;function &#40;&#41; &#123;
   
 var $prefixMessage = ''
   $&#40;'#opener'&#41;.click&#40;function &#40;&#41; &#123;
     
       if &#40;$&#40;'input&#91;name="customer1"&#93;'&#41;.val&#40;&#41; == ""&#41; &#123;
           if &#40;$&#40;'input&#91;name="customer2"&#93;'&#41;.val&#40;&#41; == ""&#41; &#123;
               $prefixMessage = 'Το πεδίο 1 και το πεδίο 2 είναι κενά';
               startDialog&#40;$prefixMessage&#41;;
               return false;
           &#125; else &#123;
               $prefixMessage = 'Το πεδίο 1 είναι κενό';
               startDialog&#40;$prefixMessage&#41;;
               return false;
                  &#125;
       &#125; else if &#40;$&#40;'input&#91;name="customer2"&#93;'&#41;.val&#40;&#41; == ""&#41; &#123;
           $prefixMessage = 'Το πεδίο 2 είναι κενό';
           startDialog&#40;$prefixMessage&#41;;
           return false;
       &#125; else &#123;
         $&#40;'#customers'&#41;.submit&#40;&#41;;
     &#125;
    
   &#125;&#41;;

function startDialog&#40;getPrefix&#41; &#123;
    var $dialog = $&#40;'<div></div>'&#41;
      .html&#40;getPrefix&#41;
      .dialog&#40;&#123;
         resizable &#58; false,
         height &#58; 140,
         modal &#58; true,
         autoOpen &#58; false,
         title &#58; 'Προσοχή!!!',
         buttons &#58; &#123;
            "κλείσιμο" &#58; function &#40;&#41; &#123;
               $&#40;this&#41;.dialog&#40;"close"&#41;;
            &#125;
         &#125;
      &#125;&#41;;
    $dialog.dialog&#40;'open'&#41;;
&#125;
  

&#125;&#41;; 

mpempe
Δημοσιεύσεις: 156
Εγγραφή: 23 Ιουν 2003 02:48
Τοποθεσία: peloponisos

jquery UI Modal alert 2

Δημοσίευση από mpempe » 03 Μάιος 2012 21:25

Πολύ ωραία
νασαι καλά alou

Παρεμπιπτόντως καλή φάση αυτό το http://jsfiddle.net

Απάντηση

Επιστροφή στο “JavaScript και Frameworks”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες