ஜாவா ஸ்கிரிப்டில் டயலாக் பாக்ஸ்கள்.
இந்த கட்டுரையில் நாம் ஜாவாஸ்கிரிப்டில் எவ்வாறு டயலாக் பாக்ஸ்களை பயன்படுத்தலாம் என்று காண இருக்கின்றோம்.
JavaScript Dialog
Boxes
ஜாவா ஸ்கிரிப்டில் மூன்று வகையான டயலாக் பாக்ஸ்கள் பயன்படுத்தப்படுகிறன. பயனரிடமிருந்து உறுதி செய்யக் கேட்டுக் கொள்ளும் confirm ,ஏதாவது ஒன்றை அறிவிப்பு செய்யும் அலெர்ட், பயனரிடமிருந்து உள்ளீடு பெற்றுக்கொள்ளும் ப்ராம்ப்ட் ஆகியவை.
ஜாவா ஸ்கிரிப்டில் மூன்று வகையான டயலாக் பாக்ஸ்கள் பயன்படுத்தப்படுகிறன. பயனரிடமிருந்து உறுதி செய்யக் கேட்டுக் கொள்ளும் confirm ,ஏதாவது ஒன்றை அறிவிப்பு செய்யும் அலெர்ட், பயனரிடமிருந்து உள்ளீடு பெற்றுக்கொள்ளும் ப்ராம்ப்ட் ஆகியவை.
மூன்று வகைகள்
1. Alert Dialog Box
- Prompt Dialog Box
- Confirmation Dialog Box
இப்பொழுது ஒவ்வொன்றாக
நாம் விரிவாக காண்போம்.
அலர்ட் டயலாக் பாக்ஸ்(Alert Dialog Box)
இது முக்கியமாக வேலிடேட் (validate)செய்வதற்கு பயன்படுகின்றது. இது டயலாக் பாக்ஸில் தகவல் ஒன்றினை காட்டும்.அதில் ஒரு o.k பட்டன் இருக்கும். அதை க்ளிக் செய்யம் வரையில் வேறு எதையும் எக்ஸ்க்யூட் (execute) செய்ய இயலாது இந்த டயலாக் பாக்ஸ் ஆனது பொதுவாக எர்ரர் மெசெஸ்களை காண்பிக்க பயன்படுகின்றது.
சான்று நிரல்-1
இது முக்கியமாக வேலிடேட் (validate)செய்வதற்கு பயன்படுகின்றது. இது டயலாக் பாக்ஸில் தகவல் ஒன்றினை காட்டும்.அதில் ஒரு o.k பட்டன் இருக்கும். அதை க்ளிக் செய்யம் வரையில் வேறு எதையும் எக்ஸ்க்யூட் (execute) செய்ய இயலாது இந்த டயலாக் பாக்ஸ் ஆனது பொதுவாக எர்ரர் மெசெஸ்களை காண்பிக்க பயன்படுகின்றது.
சான்று நிரல்-1
<!DOCTYPE html>
<html>
<title>JavaScript Dialog
Box</title>
<head></head>
<body>
<script
language="javascript">
alert("Hello, I am Muthu karthikeyan");
</script>
</body>
வெளியீடு:
ப்ராம்ப்ட்
டயலாக் பாக்ஸ்(PRompt Dialog Box)
இது பயனரிடமிருந்து உள்ளீடு பெற உதவுகின்றது.உள்ளீடு பெற உதவும் டயாலாக் பாக்ஸ் இது ஒன்று மட்டுமே ஆகும்.இதில் o.k மற்றும் Cancel ஆகிய இரண்டு பட்டன்கள் இருக்கும்.பயனரிடமிருந்து தகவல் பெற்றுக் கொண்டு அதை செயற்படுத்துகின்றது. இதற்கு இயல்பான(default) மதிப்பு ஒன்றை நிரலாளரே கொடுக்களாம்.ஏதும் இல்லாத பட்சத்தில் ‘undefined’ என்ற் எடுத்துக் கொள்ளும்.
இது பயனரிடமிருந்து உள்ளீடு பெற உதவுகின்றது.உள்ளீடு பெற உதவும் டயாலாக் பாக்ஸ் இது ஒன்று மட்டுமே ஆகும்.இதில் o.k மற்றும் Cancel ஆகிய இரண்டு பட்டன்கள் இருக்கும்.பயனரிடமிருந்து தகவல் பெற்றுக் கொண்டு அதை செயற்படுத்துகின்றது. இதற்கு இயல்பான(default) மதிப்பு ஒன்றை நிரலாளரே கொடுக்களாம்.ஏதும் இல்லாத பட்சத்தில் ‘undefined’ என்ற் எடுத்துக் கொள்ளும்.
சான்று நிரல்-2
<!DOCTYPE html>
<html>
<body>
<p>Click the button to
demonstrate the prompt box.</p>
<button
onclick="myFunction()">Try it</button>
<p
id="demo"></p>
<script>
function myFunction() {
var person = prompt("Please enter your
name", "Muthu karthikeyan");
if (person != null) {
document.getElementById("demo").innerHTML
=
"Hello " + person + "!
How do you do?";
}
}
</script>
</body>
</html>
மேலே
உள்ள நிரலில் பெயர் ஒன்று இன்புட் வாங்கப்ப்டுகின்றது . அதன் டீஃபால்ட்
(DEFAULT)மதிப்பாக ஒன்றும் காண்பிக்கப்படுகின்றது. அத்துடன் சில சொற்கள்
இணைக்கப்பட்டு demo என்கின்ற எலெமண்டின் மதிப்பாக அவுட்புட் செய்கின்றது.
பட்டனை க்ளிக் செய்தவுடன்:
இப்போது பெயர் ஒன்று உள்ளீடு கொடுத்து ok பட்டன் க்ளிக் செய்து
பிறகு
கன்ஃபர்மேசன் டயலாக்
பாக்ஸ்(COnfirmation Dialog Box)
இது ஏதாவது ஒரு செயலை செய்யும் முன் பயனரிமிருந்து உறுதி செய்து
கொள்ள உதவுகின்றது. உதாரணமாக ஒரு வெப் பக்கத்திலிருந்து வெளியேறும் முன் உறுதி
செய்து கொள்ளலாம்.இதில் OK மற்றும் CANCEL ஆகிய இரு பட்டன்கள் இருக்கும். Ok என்ற பட்டனை க்ளிக் செய்தால் true என்கின்ற பூலியன்
மதிப்பையும் கேன்சல் பட்டனை க்ளிக்
செய்தால் false என்கின்ற பூலியன்
மதிப்பையும் ரிடர்ன் செய்கின்றது.
சான்று
நிரல்-3
<!DOCTYPE html>
<html>
<title>JavaScript Dialog Box</title>
<head></head>
<body>
<script language="javascript">
var t = confirm("Do
you really want to Exit?");
if(t == true)
{
document.write("Thanks for using");
}
else
{
document.write("Welcome by Muthu karthikeyan");
}
</script>
</body>
</html>
வெளியீடு:
- Ok பட்டனை க்ளிக் இடும் பொழுது:
- Cancel பட்டனை க்ளிக் இடும் பொழுது:
to learn software courses in tamilnad,madurai, india contact me at 9629329142.
-முத்து கார்த்திகேயன்,மதுரை.
No comments:
Post a Comment