Satura rādītājs
PHP un Jquery kombinācija ir viena no visbiežāk izmantotajām metodēm dinamisku tīmekļa lietojumprogrammu izstrādei.JQuery bibliotēka piedāvā daudzus Jquery spraudņus, kurus izstrādātāji izmanto, lai piešķirtu savām lietojumprogrammām lielu dinamismu, lai uzlabotu apmeklētāju pieredzi gan interneta pārlūkprogrammā, gan mobilajā ierīcē. Mēs turpināsim izstrādāt apmācības lietojumprogrammu Ģenerēt dinamiskus sarakstus ar Jquery, Php un Mysql, mēs pievienosim dinamiskas veidlapas, lai reģistrētu un modificētu informāciju, pielietojot php un jquery kombināciju, mēs varam veikt šo uzdevumu, nenovirzot lapu.
Mēs pievienosim arī spraudni jquery.validator kas ļaus mums apstiprināt veidlapas laukus.
UzmanībuŠai apmācībai mums būs nepieciešams spraudnis, kuru mēs varam lejupielādēt no vietnes http://jqueryvalidation.org/, kad to lejupielādēsim, mēs to izpakosim un mums būs visi faili, par kuriem mēs esam ieinteresēti tikai divos gadījumos:
jquery.validate.js kāds ir pats spraudnis messages_es.js kurā failā mēs ievietosim apmeklētājam ziņojumus, un mēs varam to tulkot pēc valodas.
Mēs pievienojam failus projektu direktorijai:
Pēc tam mums ir izveidots transportlīdzekļu saraksts, mēs pievienosim veidlapu transportlīdzekļu reģistrēšanai.
Turpinot ar kodu no iepriekšējās apmācības, mums ir jābūt slānim, kurā veidlapas tiks parādītas, kad tās tiks izsauktas, izmantojot Jquery, šim nolūkam zem jaunās pogas mēs izveidosim veidlapu slāni.
PALIELINĀT
Tīmekļa lapas index.php galvenē mēs pievienojam jquery.validator un ziņojumu bibliotēkas. Tad mēs tos izmantosim, lai izveidotu dinamiskas formasJa mēs nevēlamies lejupielādēt spraudni, mēs varam to izmantot no ārēja servera
Tagad mēs izveidosim failus ar veidlapu, kas tiks izmantota transportlīdzekļa reģistrēšanai un ko mēs izmantosim no jaunās pogas. Lai to izdarītu, mums ir jānodrošina, lai jaunajai pogai būtu ID (identifikators), lai mēs pēc tam varētu atpazīt, kad notiek notikums, kurā, piemēram, notiek klikšķis. Tad pogas kods būs šāds:
Komponenta nosaukums un identifikators katram html komponentam var būt vienādi, bet unikāli. Failā function.js mēs ierakstām šādu kodu, kas noteiks peles klikšķi uz pogas newvehiculo un izsauks hivehiculos failu, izmantojot reģistrācijas veidlapu.
// Izsaukt transportlīdzekļa reģistrācijas veidlapu $ (function () {$ ("# newvehiculo"). Noklikšķiniet uz (function () {$ .get ("http: //localhost/proyectos/agenciaautos/altavehiculos.php", funkcija (dati) {$ ("# formas"). html (dati); // Es ņemu lapas rezultātu un ievietoju datus divformās});});});
Tad mēs izveidojam reģistrācijas veidlapu, kuras nosaukums būs altavehiculos.php
Galvenē ir iekļautas nepieciešamās bibliotēkas, lai varētu strādāt ar jquery un apstiprināt laukus
Mēs veidojam dažus stilus, lai veidlapai piešķirtu zināmu dizainu un kārtību. Piemēram, to var izmantot tajā pašā failā vai atsevišķā stila lapas failā un pēc tam pievienot galvenē.
Tad mēs rakstām kodu datu saglabāšanai un veidlapas kodu datu iegūšanai
$ vērtība) {$ _POST [$ key] = mysql_real_escape_string ($ vērtība); } $ sql = "INSERT INTO" transportlīdzekļi "(" vehicle_idtype "," raksturojums "," brandid "," modelid "," photo1 ") VALUES ('{$ _POST [' vehicle_idtype ']}', '{$ _POST [ 'features']} ',' {$ _POST ['brand id']} ',' {$ _POST ['model id']} ',' {$ _POST ['photo1']} ') "; mysql_query ($ sql) vai mirst (mysql_error ()); atbalss "Reģistrācija pabeigta."; }?> var13 -> // Es konsultējos ar transportlīdzekļiem, lai aizpildītu transportlīdzekļa tipa izvēli Transportlīdzekļa reģistrācijaTransportlīdzekļa izvēle
Es arī izveidoju Jquery funkcijas, lai saistītu reģistrācijas veidlapas paziņojumus
// atlasiet saistīto transportlīdzekļa reģistrāciju un zīmolus $ (funkcija () {$ ("# transportlīdzekļa reģistrācija"). change (function () {vehicle = $ (this) .val (); // Atlasītā vērtība $ .get ("http : //localhost/proyectos/agenciaautos/marcas.php?idvehiculo="+vehiculo, function (data) {$ ("# altamarca"). html (dati); // Es ņemu lapas rezultātu un ievietoju datus kombinētais});});}); // atlasiet saistītus zīmolus un modeļus $ (function () {$ ("# highbrand"). change (function () {brand = $ (this) .val (); // Atlasītā vērtība $ .get ("http: / /localhost/proyectos/agenciaautos/modelos.php?idmarca="+marca, function (data) {$ ("# altamodelo"). html (data); // Es ņemu lapas rezultātu un ievietoju datus atlasē} );});});
Kad esam pabeiguši un izpildām jauno pogu, reģistrācijas veidlapai vajadzētu parādīties šādi:
Kā redzam, veidlapa tiek parādīta bez lapas novirzīšanas, ja mūsu pārlūkprogrammā ir instalēts tāds spraudnis kā Firebug, fonā var redzēt Jquery zvanus.
Visbeidzot, mēs izveidosim veidlapas validācijas kodu, izmantojot vienkāršu jquery skriptu un validētāja spraudņa noteikumus. Failā function.js mēs izveidojam skriptu un atsaucamies uz veidlapas ID un piešķiram tai funkciju validēt un spāņu valodu, pretējā gadījumā pēc noklusējuma tas parādīs kļūdas ziņojumu pēc angļu valodas.
// veidlapas validācija $ (dokuments) .ready (funkcija () {$ ("# frmalta"). validate ({lang: 'es' // vai jebkura valodas opcija.});});
Tad komponentā, kuru vēlamies apstiprināt, mēs pievienojam nepieciešamo klasi, tas ir, elements nevar būt tukšs vai bez datiem.
Apstiprināšanas klases var atrast ziņojumu failā. Apstiprināšanas piemērs
Apstipriniet e -pastu:
Apstipriniet datumu:
Apstipriniet numuru:
Tātad, ja mēs pievienojam vajadzīgo klasi savai veidlapai, piemēram, tekstarejas elementam un atlasītu paziņojumu gadījumā pirmā opcija jāatstāj tukša, tad, ja nekas nav atlasīts, kļūda radīsies un veidlapa netiks nosūtīts.
Iespējas
Piemērs atsevišķiem modeļiem:
Modeļa izvēle
Visbeidzot, ja mēs aizpildīsim veidlapu un noklikšķināsim uz pogas Saglabāt, veidlapa pati nosūtīs, veicot jquery zvanu uz to pašu lapu altavehiculos.php, kas nosūta karogu, kas nosūtīts ar vērtību 1, un pēc tam aktivizē ievietošanu MySQL tabulā.
Viena detaļa, kas vēl jāizdara, izmantojot jquery vai novirzot tradicionālā veidā, ir tāda, ka, saglabājot datus, augšdaļā esošais saraksts tiek atsvaidzināts, jo pazūd reģistrācijas veidlapa, taču mums nav notikumu, lai apūdeņotu transportlīdzekļu sarakstu, tādēļ mums jāpievieno zvans, lai saraksts tiktu parādīts saraksta slānī, ko iepriekš izmantojām citā apmācībā, tādā veidā mēs varam reģistrēt informāciju, ja novirzāt lapu vai veicat fona uzdevumus bez lietotāja novirzīšanas uz lapu vai lai tīmekļa lietojumprogrammai piešķirtu lielāku interaktivitāti vai pārredzamību, tā ļauj atkārtoti izmantot avota kodu, jo tas ir saderīgs ar jebkuru pārlūkprogrammu un ierīci, kas ir saderīga ar javascript.Vai jums patika šī apmācība un palīdzējāt tai?Jūs varat apbalvot autoru, nospiežot šo pogu, lai sniegtu viņam pozitīvu punktu