Transcript
  • 7/25/2019 Creacin de CRUD con llamados JQuery.docx

    1/8

    CREACIN DE CRUD CON LLAMADOSJQUERY & JSON

    1. Agregamos una nueva pg!na "e #on$en!"o a% S!$e.Mas$er %%ama"o o"egas' ( %omovemos a %a #arpe$a #orrespon"!en$e.

    '. Co%o#amos un $)$u%o ( arras$ramos %a $a*%a *o"egas para +ue nos #ree e% ,r!"-!e/ %uego#am*!amos %os nom*res $a% ( #omo mues$ra es$e #0"!go

    2314o"egas25314 2asp,r!"-!eID67*o"egas,r!"-!e7runa$67server7A%%o8ag!ng679rue7A%%oSor$!ng679rue7Au$o,enera$eCo%umns67:a%se7Ce%%8a""!ng67;7Da$a??????7,r!"L!nes67None74 2A%$erna$!ngRoS$(%ea#@Co%or673!$e754 2Co%umns4 2aspComman":!e%"S3oDe%e$eu$$on679rue7S3oE"!$u$$on679rue754 2aspoun":!e%"Da$a:!e%"67IDo"ega7Bea"er9e=$67ID o"ega7Rea"On%(679rue7Sor$E=press!on67IDo"ega754 2aspoun":!e%"Da$a:!e%"67Des#r!p#!on7Bea"er9e=$67Des#r!p#!0n7Sor$E=press!on67Des#r!p#!on7

    54 25Co%umns4 2E"!$RoS$(%ea#@Co%or67>';1:754 2:oo$erS$(%ea#@Co%or67>FCD17:on$Go%"679rue7:oreCo%or673!$e754 2Bea"erS$(%ea#@Co%or67>FCD17:on$Go%"679rue7:oreCo%or673!$e754 28agerS$(%ea#@Co%or67>';1:7:oreCo%or673!$e7Bor!Hon$a%A%!gn67Cen$er754 2RoS$(%ea#@Co%or67>E::?:754 2Se%e#$e"RoS$(%ea#@Co%or67>D1DD:17:on$Go%"679rue7:oreCo%or67>??????754 2Sor$e"As#en"!ngCe%%S$(%ea#@Co%or67>::F:754 2Sor$e"As#en"!ngBea"erS$(%ea#@Co%or67>DE1754 2Sor$e"Des#en"!ngCe%%S$(%ea#@Co%or67>EEE:754 2Sor$e"Des#en"!ngBea"erS$(%ea#@Co%or67>;FE754 25asp,r!"-!e4 2aspS+%Da$aSour#eID67*o"egasS+%Da$aSour#e7runa$67server7Conne#$!onS$r!ng672K

    Conne#$!onS$r!ngsDeau%$Conne#$!onK47De%e$eComman"67DELE9E :ROM o"ega BERE IDo"ega 6PIDo"ega7Inser$Comman"67INSER9 IN9O o"ega Des#r!p#!on -ALUES PDes#r!p#!on78rov!"erName672K Conne#$!onS$r!ngsDeau%$Conne#$!on.8rov!"erName K47Se%e#$Comman"67SELEC9IDo"ega/ Des#r!p#!on :ROM o"ega7Up"a$eComman"67U8DA9E o"ega SE9 Des#r!p#!on 6PDes#r!p#!on BERE IDo"ega 6 PIDo"ega74 2De%e$e8arame$ers4 2asp8arame$erName67IDo"ega79(pe67In$?'754 25De%e$e8arame$ers4 2Inser$8arame$ers4 2asp8arame$erName67Des#r!p#!on79(pe67S$r!ng754 25Inser$8arame$ers4 2Up"a$e8arame$ers4 2asp8arame$erName67Des#r!p#!on79(pe67S$r!ng754 2asp8arame$erName67IDo"ega79(pe67In$?'754

    25Up"a$e8arame$ers4 25aspS+%Da$aSour#e4

    ?. Des#argamos unos )#onos para e"!$ar/ *orrar/ guar"ar ( #an#e%ar/ pe+ueos/ pue"e ser "e1 = 1. Y #o%o#amos %os respe#$!vos )#onos a% ,r!"-!e/ %uego #o%o#amos %as opera#!ones#omo un $emp%a$e Te%".

    ;. 8ro*emos %o +ue 3emos 3e#3o 3as$a e% momen$o

  • 7/25/2019 Creacin de CRUD con llamados JQuery.docx

    2/8

    . Cam*!ar

    2asp9emp%a$e:!e%"S3oBea"er67:a%se74 2E"!$I$em9emp%a$e4 2aspImageu$$onID67Imageu$$on17runa$67server7Causes-a%!"a$!on679rue7Comman"Name67Up"a$e7ImageUr%675Images5I#ons5save.png79e=$67A#$ua%!Har754 &n*spV2aspImageu$$onID67Imageu$$on'7runa$67server7Causes-a%!"a$!on67:a%se7Comman"Name67Can#e%7ImageUr%675Images5I#ons5#an#e%.png79e=$67Can#e%ar754 25E"!$I$em9emp%a$e4 2I$em9emp%a$e4 2aspImageu$$onID67Imageu$$on17runa$67server7Causes-a%!"a$!on67:a%se7Comman"Name67E"!$7ImageUr%675Images5I#ons5e"!$.png79e=$67E"!$ar754 &n*spV2aspImageu$$onID67Imageu$$on'7runa$67server7Causes-a%!"a$!on67:a%se7Comman"Name67De%e$e7ImageUr%675Images5I#ons5"e%e$e.png79e=$67E%!m!nar754 25I$em9emp%a$e4 25asp9emp%a$e:!e%"4

    8or

    2asp9emp%a$e:!e%"S3oBea"er67:a%se74 2E"!$I$em9emp%a$e4 2aspImageu$$on

    ID67Imageu$$on17 runa$67server7 Causes-a%!"a$!on679rue7 Comman"Name67Up"a$e7 ImageUr%675Images5I#ons5save.png7 9oo%9!p67,uar"a %os #am*!os7 9e=$67A#$ua%!Har754 2aspImageu$$onID67Imageu$$on'7 runa$67server7 Causes-a%!"a$!on67:a%se7 Comman"Name67Can#e%7 ImageUr%675Images5I#ons5#an#e%.png7 9oo%9!p67Can#e%a %os #am*!os7 9e=$67Can#e%ar754

    25E"!$I$em9emp%a$e4 2I$em9emp%a$e4 2aspImageu$$on ID67Imageu$$on17 runa$67server7 Causes-a%!"a$!on67:a%se7 Comman"Name67E"!$7 ImageUr%675Images5I#ons5e"!$.png7 9oo%9!p67E"!$a e% reg!s$ro7 9e=$67E"!$ar754 2aspImageu$$on ID67Imageu$$on'7 runa$67server7

  • 7/25/2019 Creacin de CRUD con llamados JQuery.docx

    3/8

    9oo%9!p67orrar reg!s$ro7 Causes-a%!"a$!on67:a%se7 A%$erna$e9e=$6W2K>Eva%7IDo"ega7 K4W OnC%!en$C%!#@67Xavas#r!p$re$urn #onTrmarorra"o$3!s.a%$V7 Comman"Name67De%e$e7 ImageUr%675Images5I#ons5"e%e$e.png7 9e=$67E%!m!nar754 25I$em9emp%a$e4 25asp9emp%a$e:!e%"4

    . Agregue e% s!gu!en$e S#r!p$ 2s#r!p$4 un#$!on#onTrmarorra"oID a%er$IDV 72"!v425"!v47.3$m%7ZRea%men$e "esea *orrar e% reg!s$ro[7. "!a%og $!$%e 7MensaXe7/ mo"a% $rue/ *u$$ons $e=$ 7S!7/ #%!#@ un#$!on a%er$7Yes7V $3!s."!a%og7#%ose7V \

    \/ $e=$ 7No7/ #%!#@ un#$!on a%er$7No7V $3!s."!a%og7#%ose7V \ \ \ V re$urna%seV \ 25s#r!p$4

    F. 8ro*emos %o +ue %%evamos 3as$a e% momen$o

    . Reemp%a#emos %os a%er$ por e% ver"a"ero %%ama"o a %a un#!0n +ue va%!"a ( *orra %a*o"ega. Reemp%a#e e% s#r!p$ por

    un#$!on#onTrmarorra"oID 72"!v425"!v47.3$m%7ZRea%men$e "esea *orrar e% reg!s$ro[7. "!a%og $!$%e 7MensaXe7/ mo"a% $rue/ *u$$ons $e=$ 7S!7/ #%!#@ un#$!on orrarReg!s$roIDV $3!s."!a%og7#%ose7V \ \/

  • 7/25/2019 Creacin de CRUD con llamados JQuery.docx

    4/8

    $e=$ 7No7/ #%!#@ un#$!on $3!s."!a%og7#%ose7V \ \ \ V re$urna%seV

    \

    . Agreguemos %a un#!0n orrarReg!s$ro

    un#$!onorrarReg!s$roID varpageUr% 6 W2K6Reso%veUr%75Man$en!m!en$os5o"egas'.asp=5orrarReg!s$ro7 K4WV varparame$er 6 7ID7 ID \ .aXa= $(pe W8OS9W/ ur% pageUr%/ "a$a JSON.s$r!ng!(parame$er/ #on$en$9(pe Wapp%!#a$!on5XsonV #3arse$6u$GW/ "a$a9(pe WXsonW/ su##ess un#$!on"a$a

    72"!v425"!v47.3$m%"a$a.". "!a%og $!$%e 7ConTrma#!0n7/ mo"a% $rue/ *u$$ons $e=$ 7O@7/ #%!#@ un#$!on $3!s."!a%og7#%ose7V \ \ \ V \/ error un#$!on"a$a/ su##ess/ error 72"!v425"!v47.3$m%7No se pue"e *orrar *o"ega/ $!ene reg!s$ros re%a#!ona"os7. "!a%og $!$%e 7Error7/ mo"a% $rue/ *u$$ons $e=$ 7O@7/ #%!#@ un#$!on $3!s."!a%og7#%ose7V \ \ \ V \

    \V \

    1.Creamos e% m]$o"o De%e$eo"ega en e% CADo"ega

    11.Agreguemos e% e* Me$3o" orrarReg!s$ro

    e*Me$3o" pu*%!#s$a$!#s$r!ngorrarReg!s$ro!n$ID CADo"ega.De%e$eo"egaIDV re$urn7o"ega *orra"a7V \

  • 7/25/2019 Creacin de CRUD con llamados JQuery.docx

    5/8

    1'.8ro*emos %o +ue %%evamos 3as$a e% momen$o

    1?.A3ora agreguemos un *o$0n "e nuevo/ "espu]s "e% $)$u%o "e *o"egas

    2aspu$$onID67nuevou$$on7runa$67server79e=$67Nuevo Reg!s$ro7CssC%ass67nuevou$$on754

    1;.Y #reemos e% "!v #on e% #on$en!"o "e nueva *o"ega

    2"!v!"67"!a%ogGnuevo7$!$%e67Nuevo reg!s$ro74 2p4 Des#r!p#!0n 2asp9e=$o=ID67"es#r!p#!on9e=$o=7runa$67server7425asp9e=$o=4 25p4 25"!v4

    1.A"!#!onemos es$e #0"!go a% s#r!p$ para +ue %%ame e% "!a%ogo an$es "e 25s#r!p$4

    "o#umen$.rea"(un#$!on 7>"!a%ogGnuevo7.3!"eV

    7.nuevou$$on7.#%!#@un#$!on 2K "es#r!p#!on9e=$o=.9e=$ 6 s$r!ng.Emp$(V K4 7>"!a%ogGnuevo7."!a%og res!Ha*%e a%se/ 3e!g3$ '/ !"$3 ?/

    mo"a% $rue/ *u$$ons 7Agregar7 un#$!on a%er$7Yes7V $3!s."!a%og7#%ose7V \/ 7Can#e%ar7 un#$!on $3!s."!a%og7#%ose7V \ \ \V re$urna%seV \V

    \V

    1.8ro*emos %o +ue %%evamos 3as$a e% momen$o

  • 7/25/2019 Creacin de CRUD con llamados JQuery.docx

    6/8

    1F.Cam*!en e% a%er$^Yes_ por e% ver"a"ero %%ama"o %a un#!0n +ue agrega %a *o"ega

    Cam*!e

    a%er$7Yes7V8or

    Inser$o"egaV

    1.Y agreguemos %a un#!0n Inser$o"ega/ an$es "e% "o#umen$

    un#$!onInser$o"ega varpageUr% 6 W2K6Reso%veUr%75Man$en!m!en$os5o"egas'.asp=5Inser$o"ega7 K4WV var"es#r!p#!on 6 7>2K6"es#r!p#!on9e=$o=.C%!en$ID K47.va%V varparame$er 6 7"es#r!p#!on7 "es#r!p#!on/ \ .aXa= $(pe W8OS9W/ ur% pageUr%/ "a$a JSON.s$r!ng!(parame$er/ #on$en$9(pe Wapp%!#a$!on5XsonV #3arse$6u$GW/ "a$a9(pe WXsonW/ su##ess un#$!on"a$a

    72"!v425"!v47.3$m%"a$a.". "!a%og $!$%e 7ConTrma#!0n7/ mo"a% $rue/ *u$$ons $e=$ 7O@7/ #%!#@ un#$!on $3!s."!a%og7#%ose7V \ \ \ V \/ error un#$!on"a$a/ su##ess/ error

    72"!v425"!v47.3$m%7Error 7` error. "!a%og $!$%e 7Error7/ mo"a% $rue/ *u$$ons $e=$ 7O@7/ #%!#@ un#$!on $3!s."!a%og7#%ose7V \ \ \ V \ \V

    \

    1.Y #reemos e% e* Me$3o" Inser$o"ega

    e*Me$3o" pu*%!#s$a$!#s$r!ngInser$o"egas$r!ng"es#r!p#!on !"es#r!p#!on 66 s$r!ng.Emp$( re$urn7e*e !ngresar una "es#r!p#!0n7V \

    CADo"ega.Inser$o"ega"es#r!p#!onV

  • 7/25/2019 Creacin de CRUD con llamados JQuery.docx

    7/8

    re$urn7o"ega agrega"a #orre#$amen$e7V \

    '.8ro*emos %o +ue 3emos %ogra"o

    '1.8ara +ue %a pg!na 3aga una re#arga au$om$!#a/ agregue es$as %)neas an$es "e% b%$!moasp#on$en$

    2"!v!"673!"e74 2aspu$$onID67a@eu$$on7CssC%ass67a@eu$$on7runa$67server79e=$67:a@e7OnC%!#@67a@eu$$oncC%!#@754 25"!v4

    ''.Y en e% even$o a@eu$$oncC%!#@ #o%o+ue es$ %)nea

    pro$e#$e"vo!"a@eu$$oncC%!#@o*Xe#$sen"er/ Even$Argse Response.Re"!re#$75Man$en!m!en$os5o"egas'.asp=7V \

    '?.O#u%$emos es$a "!v!s!0n/ Xus$o "espu]s "on"e o#u%$amos "e% "!a%ogGnuevo

    7>"!a%ogGnuevo7.3!"eV 7>3!"e7.3!"eV

    ';.Agreguemos un %%aman"o a% a@eu$$on Xus$o an$es "e #errar %os "!a%oos "e #onTrma#!0n"e agregar ( e%!m!nar *o"ega

  • 7/25/2019 Creacin de CRUD con llamados JQuery.docx

    8/8

    $!$%e 7ConTrma#!0n7/ mo"a% $rue/ *u$$ons $e=$ 7O@7/ #%!#@ un#$!on 7.a@eu$$on7.#%!#@V $3!s."!a%og7#%ose7V \ \

    '.De es$a manera (a no $enemos e% pro*%ema "e reres#a"o "e pan$a%%a


Top Related