કૉમ્પોઝર સાથે ફોર્મ કેવી રીતે ઉમેરવું

06 ના 01

કૉમ્પોઝર સાથે એક ફોર્મ ઉમેરો

ત્યાં ઘણી વખત જ્યારે તમે એવા વેબ પૃષ્ઠો બનાવી રહ્યા હોવ જ્યાં તમને લૉગિન પૃષ્ઠ, નવું એકાઉન્ટ બનાવટ, અથવા પ્રશ્નો અથવા ટિપ્પણીઓ સબમિટ કરવા માટે વપરાશકર્તા દ્વારા સબમિટ કરેલ ઇનપુટ પ્રક્રિયા કરવાની જરૂર છે. વપરાશકર્તા ઇનપુટ એક HTML ફોર્મનો ઉપયોગ કરીને અને વેબ સર્વર પર મોકલવામાં આવે છે. કૉમ્પોઝરના બિલ્ટ-ઇન ટૂલ્સ સાથે ફોર્મ્સ ઉમેરવાનું સરળ છે. પ્રોમ્પ્ડ ફીલ્ડ પ્રકારો જે HTML 4.0 નું સમર્થન કોમ્પોઝર સાથે ઉમેરી શકાય છે અને સંપાદિત કરી શકાય છે, પરંતુ આ ટ્યુટોરીયલ માટે આપણે ટેક્સ્ટ, ટેક્સ્ટ એરિયા, બટનો સબમિટ અને રીસેટ કરીશું.

06 થી 02

કૉમ્પૉઝર સાથે એક નવું ફોર્મ બનાવો

કોમ્પઝેરે સમૃદ્ધ સ્વરૂપ સાધનો છે જેનો ઉપયોગ તમે તમારા વેબ પૃષ્ઠો પર સ્વરૂપો ઉમેરવા માટે કરી શકો છો. ટૂલબાર પર ફોર્મ બટન અથવા સાથે ડ્રોપ ડાઉન મેનૂ પર ક્લિક કરીને ફોર્મ ટૂલ્સ ઍક્સેસ કરો. નોંધ કરો કે જો તમે તમારી પોતાની ફોર્મ હેન્ડલિંગ સ્ક્રિપ્ટ્સ ન લખો છો, તો તમારે આ પગલું માટે દસ્તાવેજીકરણમાંથી અથવા સ્ક્રીપ્ટ લખનાર પ્રોગ્રામર પાસેથી કેટલીક માહિતી મેળવવાની જરૂર રહેશે. તમે mailto સ્વરૂપોનો પણ ઉપયોગ કરી શકો છો પરંતુ તેઓ હંમેશા કામ કરતા નથી

1. સ્થાન પર તમારા કર્સરને સ્થાન આપો જે તમે તમારા ફોર્મને પૃષ્ઠ પર દેખાવા માગો છો.
2. ટૂલબાર પર ફોર્મ બટન ક્લિક કરો. ફોર્મ ગુણધર્મો સંવાદ બોક્સ ખુલે છે.
3. ફોર્મ માટે એક નામ ઉમેરો નામ ઓળખવા માટે સ્વયંચાલિત જનરેટ થયેલ HTML કોડમાં વપરાય છે અને તે જરૂરી છે. ફોર્મ ઉમેરતા પહેલા તમારે તમારું પૃષ્ઠ સાચવવાની જરૂર છે. જો તમે નવું, વણસાચવેલું પૃષ્ઠ સાથે કામ કરી રહ્યા હો, તો કોમ્પઝેરે તમને સાચવવા માટે પૂછશે.
4. સ્ક્રિપ્ટમાં URL ઉમેરો જે ક્રિયા URL ફીલ્ડમાં ફોર્મ ડેટા પર પ્રક્રિયા કરશે. ફોર્મ હેન્ડલર્સ સામાન્ય રીતે PHP અથવા સમાન સર્વર બાજુની ભાષામાં લખેલા સ્ક્રિપ્ટ્સ છે. આ માહિતી વિના, તમારું વેબપૃષ્ઠ વપરાશકર્તા દ્વારા દાખલ કરાયેલ ડેટા સાથે કંઇપણ કરી શકશે નહીં. કોમ્પૉઝર તમને ફોર્મ હેન્ડલર માટે URL દાખલ કરવા માટે પૂછશે જો તમે તેને દાખલ કરશો નહીં.
5. સર્વરમાં ફોર્મ ડેટાને સબમિટ કરવા માટે ઉપયોગમાં લેવાતી પદ્ધતિ પસંદ કરો. બે પસંદગીઓ મળે છે અને POST. તમને સ્ક્રિપ્ટની કઈ પદ્ધતિની જરૂર છે તે જાણવાની જરૂર પડશે.
6. ઑકે ક્લિક કરો અને ફોર્મ તમારા પૃષ્ઠ પર ઉમેરાયું છે.

06 ના 03

કૉમ્પોઝર સાથે ફોર્મમાં ટેક્સ્ટ ફીલ્ડ ઉમેરો

એકવાર તમે કૉમ્પોઝર સાથે પૃષ્ઠ પર એક ફોર્મ ઉમેર્યું છે, ફોર્મ પ્રકાશ વાદળી ડૅશ લાઇનમાં પૃષ્ઠ પર દર્શાવેલ હશે. તમે આ ક્ષેત્રની અંદર તમારા ફોર્મ ફીલ્ડ્સને ઉમેરો છો. તમે ટેક્સ્ટમાં ટાઇપ કરી શકો છો અથવા ઈમેજો ઉમેરી શકો છો, જેમ કે તમે પૃષ્ઠના કોઈપણ અન્ય ભાગ પર કરો છો. વપરાશકર્તાને માર્ગદર્શન આપવા માટે ફીલ્ડ્સ બનાવવા માટે પ્રોમ્પ્ટ્સ અથવા લેબલ્સ ઉમેરવા માટે ટેક્સ્ટ ઉપયોગી છે.

1. આઉટલાઇન ફોર્મ વિસ્તારમાં જવા માટે તમે ટેક્સ્ટ ફીલ્ડમાં ક્યાં છો તે પસંદ કરો. જો તમે લેબલ ઍડ કરવા માંગો છો, તો તમે પહેલા ટેક્સ્ટને ટાઇપ કરી શકો છો.
2. ટૂલબાર પર ફોર્મ બટનની બાજુમાં નીચે તીરને ક્લિક કરો અને ડ્રોપ ડાઉન મેનુમાંથી ફોર્મ ફીલ્ડ પસંદ કરો.
3. ફોર્મ ફીલ્ડ પ્રોપર્ટીઝ વિન્ડો ખુલશે. ટેક્સ્ટ ફીલ્ડ ઉમેરવા માટે, ફીલ્ડ પ્રકારનાં લેબલ ડ્રોપ ડાઉન મેનૂમાંથી ટેક્સ્ટ પસંદ કરો
4. ટેક્સ્ટ ફીલ્ડમાં નામ આપો. આ નામ HTML કોડમાં ક્ષેત્રને ઓળખવા માટે વપરાય છે અને ફોર્મ હેન્ડલિંગ સ્ક્રિપ્ટને ડેટા પર પ્રક્રિયા કરવા માટે નામની જરૂર છે. વધુ ગુણધર્મો / ઓછા ગુણધર્મો બટનને ટૉગલ કરીને અથવા એડવાન્સ્ડ એડિટ કરો બટન દબાવીને આ સંવાદ પર અન્ય વૈકલ્પિક વિશેષતાઓને સુધારી શકાય છે, પરંતુ હવે અમે ફક્ત ક્ષેત્ર નામ દાખલ કરીશું.
5. ઑકે ક્લિક કરો અને ટેક્સ્ટ ફીલ્ડ પૃષ્ઠ પર દેખાય છે.

06 થી 04

કૉમ્પોઝર સાથે એક ફોર્મમાં ટેક્સ્ટ એરિયા ઉમેરો

કેટલીકવાર, કોઈ ટેક્સ્ટને કોઈ ફોર્મ પર દાખલ કરવાની જરૂર પડે છે, જેમ કે સંદેશ અથવા પ્રશ્નો / ટિપ્પણીઓ ક્ષેત્ર. આ કિસ્સામાં, ટેક્સ્ટ ફીલ્ડ ફક્ત યોગ્ય નથી. તમે ફોર્મ ટૂલ્સનો ઉપયોગ કરીને ટેક્સ્ટ એરિયા ફોર્મ ફીલ્ડ ઉમેરી શકો છો.

1. તમારા કર્સરને ફોર્મની રૂપરેખામાં સ્થિત કરો જ્યાં તમે તમારા ટેક્સ્ટ એરિયાને પસંદ કરવા માંગો છો. જો તમે લેબલમાં ટાઇપ કરવા માંગતા હો, તો લેબલ ટેક્સ્ટ ટાઇપ કરવું તે ઘણી સારી વાત છે, નવી લીટી પર જવા માટે દાખલ કરો દબાવો, પછી ફોર્મ ફીલ્ડ ઉમેરો, કારણ કે પૃષ્ઠ પરના ટેક્સ્ટ એરિયાના કદને તે માટે અનાડી બનાવે છે લેબલ ડાબી કે જમણી બાજુ પર છે
2. ટૂલબાર પર ફોર્મ બટનની બાજુમાં નીચે તીરને ક્લિક કરો અને ડ્રોપ ડાઉન મેનૂમાંથી ટેક્સ્ટ એરિયા પસંદ કરો. ટેક્સ્ટ એરિયા પ્રોપર્ટીઝ વિંડો ખુલશે.
3. ટેક્સ્ટ ક્ષેત્ર ક્ષેત્ર માટે નામ દાખલ કરો. નામ HTML કોડમાં ક્ષેત્રને ઓળખે છે અને વપરાશકર્તા સબમિટ કરેલી માહિતી પર પ્રક્રિયા કરવા માટે ફોર્મ હેન્ડલિંગ સ્ક્રિપ્ટ દ્વારા ઉપયોગમાં લેવાય છે.
4. પંક્તિઓ અને કૉલમ્સની સંખ્યા દાખલ કરો કે જેને તમે ટેક્સ્ટ વિસ્તારમાં પ્રદર્શિત કરવા માંગો છો. આ પરિમાણો પૃષ્ઠ પરના ક્ષેત્રના કદને નિર્ધારિત કરે છે અને સ્ક્રૉલિંગની જરૂરિયાતો થતાં પહેલાં કેટલી ટેક્સ્ટ ફીલ્ડમાં દાખલ કરી શકાય છે.
5. વધુ અદ્યતન વિકલ્પો આ વિંડોમાં અન્ય નિયંત્રણો સાથે નિર્દિષ્ટ કરી શકાય છે, પરંતુ હવે માટે ક્ષેત્ર નામ અને પરિમાણો પર્યાપ્ત છે.
6. ઓકે ક્લિક કરો અને ટેક્સ્ટ એરિયા ફોર્મ પર દેખાય છે.

05 ના 06

કૉમ્પોઝર સાથે ફોર્મમાં સબમિટ અને ફરીથી સેટ કરો બટન ઉમેરો

વપરાશકર્તાએ તમારા પૃષ્ઠ પર ફોર્મ ભર્યા પછી, માહિતીને સર્વર પર સબમિટ કરવાની કોઈ રીત હોવી જરૂરી છે. વધુમાં, જો વપરાશકર્તા પ્રારંભ કરવા માંગે છે અથવા ભૂલ કરે છે, તો તે નિયંત્રણમાં સમાવિષ્ટ કરવા માટે મદદરૂપ છે કે જે મૂળભૂત સ્વરૂપમાંના તમામ ફોર્મ્સને ફરીથી સેટ કરશે. ખાસ ફોર્મ નિયંત્રણો આ વિધેયોને નિયંત્રિત કરે છે, જેને અનુક્રમે સબમિટ અને રીસેટ બટનો તરીકે ઓળખવામાં આવે છે.

1. તમારા કર્સરને દર્શાવેલ ફોર્મ વિસ્તારની અંદર મૂકો જ્યાં તમે હોસ્ટ કરવા માટે સબમિટ કરો અથવા ફરીથી સેટ કરો છો. મોટેભાગે, તે બાકીના ક્ષેત્રોની નીચે એક ફોર્મ પર સ્થિત થશે.
2. ટૂલબાર પર ફોર્મ બટનની બાજુમાં નીચે તીરને ક્લિક કરો અને ડ્રોપ ડાઉન મેનૂમાંથી ડિફાઇન બટન પસંદ કરો. બટન ગુણધર્મો વિંડો દેખાશે.
3. ડ્રોપ ડાઉન મેનૂથી પ્રકારનાં બટનને પસંદ કરો. તમારી પસંદગીઓ સબમિટ, રીસેટ અને બટન છે આ કિસ્સામાં અમે સબમિટ પ્રકાર પસંદ કરીશું.
4. બટનને નામ આપો, જે ફોર્મની વિનંતી પર પ્રક્રિયા કરવા માટે HTML અને ફોર્મ હેન્ડલિંગ કોડમાં વપરાશે. વેબ વિકાસકર્તાઓ સામાન્ય રીતે આ ક્ષેત્રને "સબમિટ કરો."
5. મૂલ્ય લેબલવાળી બૉક્સમાં, ટેક્સ્ટ દાખલ કરો જે બટન પર દેખાશે. ટેક્સ્ટ ટૂંકા હોવું જોઈએ પરંતુ બટનને દબાવવામાં આવે ત્યારે શું થશે તેનું વર્ણન કરવું જોઈએ. કંઈક "સબમિટ કરો", "ફોર્મ સબમિટ કરો" અથવા "મોકલો" સારું ઉદાહરણ છે.
6. ઓકે ક્લિક કરો અને ફોર્મ પર બટન દેખાય છે.

આ રીસેટ બટનને સમાન પ્રક્રિયાનો ઉપયોગ કરીને ફોર્મમાં ઉમેરી શકાય છે, પરંતુ Submit ના બદલે ટાઇપ ફીલ્ડમાંથી રીસેટ પસંદ કરો.

06 થી 06

કૉમ્પોઝર સાથે એક ફોર્મ સંપાદન

કૉમ્પોઝરમાં ફોર્મ અથવા ફોર્મ ફીલ્ડનું સંપાદન કરવું ખૂબ સરળ છે. તે ફિલ્ડ પર બમણું-ક્લિક કરો કે જેને તમે સંપાદિત કરવા માંગો છો, અને યોગ્ય સંવાદ બૉક્સ દેખાય છે જ્યાં તમે તમારી જરૂરિયાતોને અનુરૂપ ક્ષેત્રીય ગુણધર્મો બદલી શકો છો. ઉપરના રેખાકૃતિ આ ટ્યુટોરીયલમાં આવરી લેવાયેલા ઘટકોનો ઉપયોગ કરીને એક સરળ ફોર્મ બતાવે છે.