CodeIgniter & jQuery - Ajax (form validation)

Σε αυτή την περιοχή μπορείτε να βρείτε ή να αναζητήσετε πληροφορίες σχετικές με την PHP

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

Απάντηση
Άβαταρ μέλους
Lykos22
Δημοσιεύσεις: 89
Εγγραφή: 29 Μαρ 2011 16:28
Τοποθεσία: UK

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από Lykos22 » 12 Ιούλ 2013 09:20

Θα ήθελα μία μικρή βοήθεια. Έχω δημιουργήσει μια σελίδα/controller όπου μπορώ να κάνω επεξεργασία μιας σελίδας, μέσω μιας φόρμας και αυτό που θέλω είναι το validation των πεδίων να γίνεται με jQuery - Ajax εαν είναι ενεργό το Javascript στον browser, αλλιώς να γίνεται η επεξεργασία κανονικά. Εαν υπάρχουν σφάλματα στο validation να εμφανίζονται το κάθε ένα δίπλα στο αντίστοιχο πεδίο, αν γίνεται (αλλιώς πάνω από τη φόρμα όλα τα λάθη σαν λίστα).

Εδώ είναι Controller μου

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

public function edit($id){
 		.....

 		//ορισμός rules των πεδίων
 		$rules = $this->page_model->rules;
 		$this->form_validation->set_rules($rules);
 		
 		// do validation
 		if ($this->form_validation->run() === TRUE) {
 			$data = $this->page_model->array_from_post(array('parent_id','title','slug','body','template'));
 			$this->page_model->save($data, $id);
 			redirect('admin/page');
 		}

 		//load view
 		$this->data['subview'] = 'admin/page/edit';
 		$this->load->view('admin/edit_page', $this->data);
 	}
,εδώ το είναι το view μου

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

<?php echo validation_errors&#40;&#41;; ?>
	<?php echo form_open&#40;&#41;; ?>
	<table>
		<tr>
			<td>Title&#58;</td>
			<td><?php echo form_input&#40;'title', set_value&#40;'title', $page->title&#41;&#41;; ?></td><?php echo form_error&#40;'title'&#41;; ?>
		</tr>
		<tr>
			<td>Slug&#58;</td>
			<td><?php echo form_input&#40;'slug', set_value&#40;'slug', $page->slug&#41;&#41;; ?></td><?php echo form_error&#40;'slug'&#41;; ?>
		</tr>
		<tr>
			<td>Body&#58;</td><br />
			<td><?php echo form_textarea&#40;'body', set_value&#40;'body', $page->body&#41;, 'class="tinymce"'&#41;; ?></td><?php echo form_error&#40;'body'&#41;; ?>
		</tr>
και εδώ το jquery script

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

$&#40;document&#41;.ready&#40;function &#40;&#41; &#123;
	$&#40;'form.ajax-form'&#41;.on&#40;'submit', function&#40;&#41; &#123;
		var obj = $&#40;this&#41;, // &#40;*&#41; references the current object/form each time
			url = obj.attr&#40;'action'&#41;,
			method = obj.attr&#40;'method'&#41;,
			data = &#123;&#125;;

		obj.find&#40;'&#91;name&#93;'&#41;.each&#40;function&#40;index, value&#41; &#123;
			// console.log&#40;value&#41;;
			var obj = $&#40;this&#41;,
				name = obj.attr&#40;'name'&#41;,
				value = obj.val&#40;&#41;;

			data&#91;name&#93; = value;
		&#125;&#41;;

		$.ajax&#40;&#123;
			// see the &#40;*&#41;
			url&#58; url,
			type&#58; method,
			data&#58; data,
			success&#58; function&#40;response&#41; &#123;
				// console.log&#40;response&#41;;
				// $&#40;"#content"&#41;.html&#40;data&#41;; // πλαίσιο errors πάνω από τη φόρμα
			&#125;
		&#125;&#41;.error&#40;function&#40;&#41; &#123;
			// show errors
		&#125;&#41;.complete&#40;function&#40;&#41; &#123;
			// alert
		&#125;&#41;;

		// console.log&#40;'Trigger'&#41;;
		return false; //disable refresh
	&#125;&#41;;
&#125;&#41;;
[/code]

geomagas
Δημοσιεύσεις: 667
Εγγραφή: 06 Απρ 2013 13:36
Τοποθεσία: Ηράκλειο Κρήτης
Επικοινωνία:

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από geomagas » 12 Ιούλ 2013 21:32

...κι εδώ, είναι η απορία μου: Που, συγκεκριμένα, χρειάζεσαι βοήθεια;

Άβαταρ μέλους
Lykos22
Δημοσιεύσεις: 89
Εγγραφή: 29 Μαρ 2011 16:28
Τοποθεσία: UK

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από Lykos22 » 14 Ιούλ 2013 11:19

geomagas έγραψε:...κι εδώ, είναι η απορία μου: Που, συγκεκριμένα, χρειάζεσαι βοήθεια;
Θ'ελω όταν το validation αποτύχει να εμφανίζονται το κάθε σφάλμα δίπλα στο αντίστοιχο input, ενώ όταν είναι οκ να εμφανίzω σε ένα div ένα μήνυμα success. Η δυσκολία μου είναι στο πώςεπιστρέφω τα σφάλαματα ή το success στο jquery και στο view μου.

View:

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

// εαν το validation είναι οκ να εμφανίζει success-div
<div class="alert alert-success">Success!</div>
<?php echo validation_errors&#40;&#41;; ?>

<?php echo form_open&#40;'admin/product/edit, array&#40;'class' => 'ajax-form'&#41;&#41;; ?>
<p>
    <label for="product_name">Product *</label>
    <input type="text" name="product_name" value="<?php echo set_value&#40;'product_name', $prod->product_name&#41;; ?>" />
    <?php echo form_error&#40;'product_name'&#41;; ?>
</p>
<p>
    <label for="brand">Brand</label>
    <input type="text" name="brand" value="<?php echo set_value&#40;'brand', $prod->brand&#41;; ?>" />
    <?php echo form_error&#40;'brand'&#41;; ?>
</p>
Controller:

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

public function edit&#40;$id&#41;&#123;
 //set validation rules in CI
 $rules = $this->product_model->rules;
 $this->form_validation->set_rules&#40;$rules&#41;;

 // do validation
 if &#40;$this->form_validation->run&#40;&#41; === TRUE&#41; &#123;
 $data = $this->input_posts&#40;array&#40;'product_name', 'brand', 'category_id', 'description'&#41;&#41;;
 $this->product_model->save&#40;$data, $id&#41;;
 // validation succeeds, so display a success div, ti kanw return???

 // $this->session->set_flashdata&#40;'success', 'Save succesfull.'&#41;;
 // redirect&#40;'admin/product/edit', 'refresh'&#41;;
 // return true;

 &#125; else &#123;
  //validation failes, return errors
 &#125;

// load the view
$this->load->view&#40;'admin/products/manage', $data&#41;;
&#125;

geomagas
Δημοσιεύσεις: 667
Εγγραφή: 06 Απρ 2013 13:36
Τοποθεσία: Ηράκλειο Κρήτης
Επικοινωνία:

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από geomagas » 14 Ιούλ 2013 11:51

Η διαδικασία που παραθέτεις είναι αυτή που υποστηρίζει ο CI natively, και αφορά τα non-ajax requests.
Για να διαχωρίσεις τις περιπτώσεις, θα σου έλεγα, στην περίπτωση ajax, να κάνεις post σε άλλο segment του controller σου και όχι στον ίδιο, πχ στην edit_ajax. Εναλλακτικά, μπορείς να βρεις έναν τρόπο να ελέγξεις αν είναι ajax request ή όχι, και να επιστρέψεις τα ανάλογα αποτελέσματα.
Αυτό το λέω διότι, στην non-ajax μορφή επιστρέφεις html, ενώ στην ajax προσωπικά θα επέστρεφα ένα JSON object το οποίο θα ήταν εύκολα αναγνώσιμο και διαχειρίσιμο από το client script.
Φαντάσου κάτι τέτοιο:

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

&#123;
  product&#58; &#123;success&#58; 0, errors&#58; &#91;"value must be set","must contain at least x chars"&#93; &#125;,
  brand&#58; &#123;success&#58; 1, errors&#58; &#91;&#93; &#125;
&#125;
Το σκριπτάκι σου θα μπορούσε εύκολα να το διατρέξει και να αποφασίσει αν, και πού, θα πρέπει να απεικονίσει μηνύματα λαθών.

Άβαταρ μέλους
Lykos22
Δημοσιεύσεις: 89
Εγγραφή: 29 Μαρ 2011 16:28
Τοποθεσία: UK

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από Lykos22 » 14 Ιούλ 2013 12:15

geomagas έγραψε:Η διαδικασία που παραθέτεις είναι αυτή που υποστηρίζει ο CI natively, και αφορά τα non-ajax requests.
Για να διαχωρίσεις τις περιπτώσεις, θα σου έλεγα, στην περίπτωση ajax, να κάνεις post σε άλλο segment του controller σου και όχι στον ίδιο, πχ στην edit_ajax. Εναλλακτικά, μπορείς να βρεις έναν τρόπο να ελέγξεις αν είναι ajax request ή όχι, και να επιστρέψεις τα ανάλογα αποτελέσματα.
Αυτό το λέω διότι, στην non-ajax μορφή επιστρέφεις html, ενώ στην ajax προσωπικά θα επέστρεφα ένα JSON object το οποίο θα ήταν εύκολα αναγνώσιμο και διαχειρίσιμο από το client script.
Φαντάσου κάτι τέτοιο:

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

&#123;
  product&#58; &#123;success&#58; 0, errors&#58; &#91;"value must be set","must contain at least x chars"&#93; &#125;,
  brand&#58; &#123;success&#58; 1, errors&#58; &#91;&#93; &#125;
&#125;
Το σκριπτάκι σου θα μπορούσε εύκολα να το διατρέξει και να αποφασίσει αν, και πού, θα πρέπει να απεικονίσει μηνύματα λαθών.
To σκριπτάκι είναι γενικότερα ευχρηστο γιατί επιστρέφει data object, άρα υποθέτω πως λέμε το ίδιο(??). Επίσης εαν δεν είναι ajax request ή δεν είναι ενεργή η javascript από το browser η φόρμα λειτουργεί κανονικά και πάιζει το validation.

geomagas
Δημοσιεύσεις: 667
Εγγραφή: 06 Απρ 2013 13:36
Τοποθεσία: Ηράκλειο Κρήτης
Επικοινωνία:

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από geomagas » 14 Ιούλ 2013 12:26

Lykos22 έγραψε:To σκριπτάκι είναι γενικότερα ευχρηστο γιατί επιστρέφει data object
Ποιό σκριπτάκι εννοείς και τι εστί data object; Και ποιος αμφισβήτησε την ευχρηστία κάποιου script;
Lykos22 έγραψε:άρα υποθέτω πως λέμε το ίδιο(??).
Υποπτεύομαι πως όχι...
Lykos22 έγραψε: Επίσης εαν δεν είναι ajax request ή δεν είναι ενεργή η javascript από το browser η φόρμα λειτουργεί κανονικά και πάιζει το validation.
Ναι, αυτό ακριβώς εννοούσα με την πρώτη μου πρόταση, ότι αυτό το κομμάτι το έχεις ήδη καλύψει, με τη λειτουργικότητα του CI. Εδώ μιλάμε για το ajax-σενάριο.

Άβαταρ μέλους
Lykos22
Δημοσιεύσεις: 89
Εγγραφή: 29 Μαρ 2011 16:28
Τοποθεσία: UK

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από Lykos22 » 14 Ιούλ 2013 12:36

geomagas έγραψε:Ναι, αυτό ακριβώς εννοούσα με την πρώτη μου πρόταση, ότι αυτό το κομμάτι το έχεις ήδη καλύψει, με τη λειτουργικότητα του CI. Εδώ μιλάμε για το ajax-σενάριο.
Το σκριπτάκι παίρνει σαν url αυτό url = obj.attr('action'), όπου σε στέλνει δηλαδή στο ίδιο action είτε παίζει ajax σενάριο είτε όχι, άρα μιλάμε για την ίδια function του controller. Άρα αφού τη non-ajax-λειτουργία παίζει μια χαρά πώς θα μπορουσα να κάνω το ίδιο και στο ajax-σενάριο σε αυτή την περίπτωση?? Δεν γίνεται μέσα από την ίδια function να επιστρέφω και τα errors ή success μου για το ajax??

geomagas
Δημοσιεύσεις: 667
Εγγραφή: 06 Απρ 2013 13:36
Τοποθεσία: Ηράκλειο Κρήτης
Επικοινωνία:

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από geomagas » 14 Ιούλ 2013 12:44

geomagas έγραψε:Εναλλακτικά, μπορείς να βρεις έναν τρόπο να ελέγξεις αν είναι ajax request ή όχι, και να επιστρέψεις τα ανάλογα αποτελέσματα.
Πρόχειρα-πρόχειρα, θα μπορούσες να συμπεριλάβεις ένα έξτρα postfield πχ is_ajax (0 ή 1) που, στη φόρμα σου θα έχει default τιμή 0 και από jquery θα του δίνεις τιμή 1.
Μετά, βάζεις ένα if στο action σου. Αν is_ajax==0, φόρτωσε τη view σου κλπ (αυτά που ήδη κάνεις) αλλιώς επέστρεψε κάτι άλλο (πχ json_encode(......)) που θα μπορεί να το επεξεργαστεί ο client.

Άβαταρ μέλους
Lykos22
Δημοσιεύσεις: 89
Εγγραφή: 29 Μαρ 2011 16:28
Τοποθεσία: UK

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από Lykos22 » 14 Ιούλ 2013 17:16

geomagas έγραψε: Πρόχειρα-πρόχειρα, θα μπορούσες να συμπεριλάβεις ένα έξτρα postfield πχ is_ajax (0 ή 1)
Αυτό το postfield πώς θα το περάσω, σαν hidden field?? Θα μπορούσες να μου δώσεις ένα απλό παράδειγμα με βάση αυτά που έχω?

geomagas
Δημοσιεύσεις: 667
Εγγραφή: 06 Απρ 2013 13:36
Τοποθεσία: Ηράκλειο Κρήτης
Επικοινωνία:

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από geomagas » 14 Ιούλ 2013 17:50

Ακριβώς.
Ορίστε και παράδειγμα:

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

<input type="hidden" name="is_ajax" id="is_ajax" value="0"/>
<script type="text/javascript">is_ajax.value=1;</script>
Το <script> θα εκτελεστεί προφανώς μόνο αν ο browser υποστηρίζει js.

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

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από alou » 15 Ιούλ 2013 13:19

Μια υπερβολική ίσως επισήμανση: καλύτερα το τσεκάρισμα και η αλλαγή τιμής στο hidden field να γίνεται στο submit. Υπάρχει πάντα το ενδεχόμενο να απενεργοποιηθεί η js αφού έχεις φορτώσει τη σελίδα.

geomagas
Δημοσιεύσεις: 667
Εγγραφή: 06 Απρ 2013 13:36
Τοποθεσία: Ηράκλειο Κρήτης
Επικοινωνία:

CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από geomagas » 15 Ιούλ 2013 13:41

Καθόλου υπερβολική, έχεις απόλυτο δίκιο. Μάλιστα, όταν σκεφτόμουν για την απάντησή μου, η λύση που προτείνεις ήταν αυτή που μου ήρθε αυθόρμητα στο μυαλό. Όχι μόνο για το λόγο που λες, αλλά γιατί όπως και να το δεις, εκεί είναι η "θέση" του.
Συμπέρανα όμως ότι δεν είναι και τόσο διατεθειμένος να αλλάξει το javascript, οπότε προσπάθησα να βρω κάτι πιο quick'n'dirty που να προσαρμόζεται κατευθείαν στη view...

Άβαταρ μέλους
gaucho
Honorary Member
Δημοσιεύσεις: 2408
Εγγραφή: 22 Δεκ 2002 13:18

Re: CodeIgniter & jQuery - Ajax (form validation)

Δημοσίευση από gaucho » 19 Οκτ 2017 00:15

Το ci εχει κανονες για validation σταπεδια αποφορμα κ τα error μπορεις να το περναςστο view με flasdata session κ το div με fade out με jquery

Απάντηση

Επιστροφή στο “PHP Προγραμματισμός”

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

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