Sunday, March 1, 2015

অনলাইনে Indindianvisa-bangladesh website এ ক্যাপচা কোড পুনরায় রিলোড করুন সহজ উপায়ে

আজকে আমি এমন একটা জাফাস্ক্রিপ্ট ফাংশন তৈরী করতে যাচ্ছি যাতে এক্সেস কোড ইনপুট বক্সে ক্লিক করলেই ক্যাপচা কোডটি পুনরায় রিলোড হয়। ট্যাব প্রেস করেও এক্সেক কোড বক্সে ফোকাস করে এই ফাংশনকে কাজ কাজ করানো যাবে। আমরা যখন পুরনো ওয়েসবসাইটে কাজ করতাম তখন কিন্তু আমাদের ক্যাপচা কোড রিলোড করার মত তেমন কোন পদ্ধতি ছিল না, যার ফলে আমাদের ভীষণ খাটতে হত অর্থাৎ নতুন করে পেজটি রিলোড করে আবার সমস্ত ভিসা তথ্য দিয়ে ফর্ম ফিলাপ করতে হত। তাছাড়া রিপ্রিন্ট পেজটাকে যখন আমরা বেশ কিছুক্ষণ ধরে রেখে দিতাম সাবমিট না করে, তাহলে কেপচা কোড লিখে সাবমিট করলেই এক্সেস কোড ভুল দেখাত, ফলে আমাদের সব কাজ ভন্ডুল হয়ে যেত ওই একটিমাত্র কারনে। চলুন শুরু করা যাক আমাদের এই ক্যাপচা কোড রিলোড করার জাভাস্ক্রিপ্ট কেরামতি।

জাভাস্ক্রিপ্টের একটু গভীরে

আপনি এখন আপনার ডিফল্ট ব্রাউজারটি ওপেন করুন।
এরপর, ইন্ডিয়ান-বাংলাদেশ ভিসার অফিশিয়াল ওয়েবসাইটে গিয়ে “প্রিন্ট রেজিস্টারড অ্যাপ্লিকেশন” লিঙ্কে ক্লিক করুন।
যখন পেজটি সম্পূর্ণভাবে ব্রাউজারে লোড হবে, তখন আপনি CTRL+U বা মাউসের রাইট ক্লিক করে “ভিউ পেজ সোর্স”-এ ক্লিক করতে পারেন। আপনি এখন একটা সোর্স কোড এর পেজ দেখতে পাচ্ছেন, আপনি যদি এই সোর্স কোডের একেবারে উপরের দিকে লক্ষ্য করেন তাহলে আপনি refreshCaptcha ফাংশান দেখতে পাবেন নিচে প্রদর্শিত চিত্রের মত।

আমাদের শুধুমাত্র refreshCaptcha  কপি করতে হবে, কোড পরীক্ষা করার প্রয়োজন হবে না। এখন সোর্স পেজটিকে বন্ধ করে দিয়ে Reprint.jsp পেজ এ ফিরে যান, এরপর ওয়েব পেজ এর উপর মাউসের রাইট ক্লিক করুন এবং কনটেক্সট মেনু থেকে ইন্সপেক্ট এলিমেন্ট অপশনে ক্লিক করুন। স্বাভাবিকভাবে আমরা জেভাবে কন্সোল ট্যাবে যাই সেভাবেই কন্সোলে ট্যাব এ ক্লিক করুন।
প্রথমে আমাদের ফর্ম এর নাম কি জানা প্রয়োজন, সুতরাং, নিচের কোডটি টাইপ করে এন্টার কী প্রেস করুন:
document.forms[0]
ব্রাউজারের কন্সোল প্যানেলে এই রেজাল্ট দেখতে পাবেনঃ
<body onpest="return false;" oncopy="return false;" oncut="return false;">...</body>
আপনি কনসোল প্যানেলের কোডটি থেকে বুঝতেই পারছেন যে ফর্মটির নাম OnlineForm । আমাদের এখন এক্সেস কোড ইনপুট বক্সটির নাম জানা প্রয়োজন,  তাহলে আমরা যদি নিচের কোডটি টাইপ করে এন্টার বাটনে চাপ দিই তাহলে যতগুলি HTML ইনপুট এলিমেন্ট আছে আমাদের কনসোল প্যানেলে সেগুলি শো করবেঃ
OnlineForm.getElementsByTagName('input');
রেজাল্টঃ
[
<input name="fileno" type="text" class="textBoxDashed" id="fileno" value="" size="20" maxlength="12" title="Please Enter your Application Id" onkeyup="chkAlphaNum(this)" onblur="trim1(this)" isdatepicker="true">
<input name="birthdate" type="text" value="" title="Please Enter you Date of Birth As in Passport" class="textBoxDashed" id="birthdate" datepicker="true" datepicker_max="01/03/2015" size="20" maxlength="10" datepicker_format="DD/MM/YYYY" isdatepicker="true">
<input name="passport_no" type="text" title="Please Enter you Passport No. As in Passport" class="textBoxDashed" id="passport_no" value="" size="20" maxlength="14" onkeyup="chkAlphaNum(this)" onblur="trim1(this);" isdatepicker="true">
<input name="ImgNum" type="text" class="textBoxDashed1" id="ImgNum" onkeyup="chkAlphaNum(this)" size="20" maxlength="6" isdatepicker="true">
<input name="Reprint" type="button" class="btn btn-primary" onclick="chkCapRep()" value="Reprint">
<input name="Appointment" type="button" onclick="chkCapAppt()" class="btn btn-primary" id="Appointment" value="Get Appointment">
<input type="hidden" name="Date" value="01/03/2015">]
যে ফলাফল গুলি কনসোল প্যানেলে দেখায় সেগুলোর একেকটায় আপনি মাউসের দ্বারা ক্লিক করবেন, তাহলে রিপ্রিন্ট পেজের একেকটা ইনপুট ফিল্ড হাইলাইট হয়ে যাবে।আমাদের শুধু এক্সেস কোড এর টেক্সট ইনপুট ফিল্ডের নাম টা জানা জরুরি, তাই আপনি যখন দেখবেন ওই ইনপুট ফিল্ডটা হাইলাইট হয়ে গেছে তখন আপনি কন্সোল প্যানেলের ওই ইনপুট এলেমেন্টের নেম অ্যাট্রিবিউটকেই নোট করে নেবেন, আপনি তাহলে এখন কি দেখতে পাচ্ছেন, ImgNum নিশ্চয়ই। ঠিকই ধরেছেন। আমাদের কনসোল প্যানেল যেহেতু কোডগুলির দ্বারা ভর্তি হয়ে গেছে তাই আমরা CTRL+L প্রেস করে ওইগুলোকে ক্লিয়ার করে নেব।

জাভাস্ক্রিপ্ট কোড

ImgNum.addEventListener('focus', function () {
    refreshCaptcha();
});
এখন আপনি নিচের কোডটি কপি করে কন্সোলে পেস্ট করে দিয়ে এন্টার প্রেস করুন। এরপর আপনি যখন ওই এক্সেস কোডের ইনপুট বক্সে ক্লিক করবেন অথবা ট্যাব প্রেস করে কারসারটিকে এক্সেস কোডের ইনপুট ফিল্ডে আনবেন তখন ক্যাপচা কোড রিলোড হচ্ছে দেখতে পাবেন।

ভিডিও টিউটোরিয়াল



ডাউনলোড

আপনি আমাদের Fresh Tech Bloggers ওয়েবসাইটে গিয়ে সোর্স কোডটি ডাউনলোড করে নিতে পারেন। আমাদের পরবর্তী টিউটোরিয়াল এ আপনাকে শেখাব যে আপনি কিভাবে ভিসা তথ্য অনলাইন ইন্ডিয়ান ভিসা ওয়েব সাইটে অনায়াসেই পুরণ করতে পারবেন।

1 comment: