ইন্ডিয়ানভিসা-বাংলাদেশ ফর্ম পূরণ করার একটি সম্পূর্ণ বৈশিষ্ট্যযুক্ত জাভাস্ক্রিপ্ট ট্রিক

Full Featured Javascript Trick

আপনাকে স্বাগত জানাই, আমি আপনাদের জন্য একটি সম্পূর্ণ বৈশিষ্টযুক্ত জাভাস্ক্রিপ্ট ট্রিক নিয়ে এসেছি। আশা করি আপনাদের ভাল লাগবে। আগের পোস্টগুলিতে আমি এই পোস্ট গুলি দেখিয়েছিলামঃ

১. জাভাস্ক্রিপ্ট দিয়ে ভিসা ফর্ম পূরণ
২. বডি এলিমেন্ট থেকে oncopy, onpaste, occut অ্যাট্রিবিউট বাদ দেওয়া
৩. জাভাস্ক্রিপ্টের মাধ্যমে ক্যাপচা ইমেজ কোড রিলোড রিলোড
৪. অ্যাপয়েন্টমেন্ট বাটনকে ওয়েব পেজে সহজে নিয়ে আসা

জাভাস্ক্রিপ্টের মাধ্যমে অনেক অসম্ভব কাজ সহজ করা যায়। উদাহরণস্বরূপ আমরা হিডেন এলিমেন্টকে দেখতে পাইনা, কিন্তু জাভাস্ক্রিপ্ট কোডের মাধ্যমে আমরা এই সমস্ত লুকিয়ে থাকা ইনপুট এলিমেন্টকে সহজেইই কন্সোল প্যানেলে শো করাতে পারি।

এই টিউটোরিয়ালে আমরা নিম্নলিখিত কাজ গুলি করাতে চাই জাভাস্ক্রিপ্টকে দিয়ে,

১. স্বয়ংক্রিয়ভাবে অনলাইন ফর্মে কোনরকম টাইপ বা কপি-পেস্ট ছাড়াই ফর্ম ফিল্ড পূরণ করা
২. ওয়েব পেজে ডিফল্ট অ্যাপয়েন্টমেন্ট বাটন প্রদর্শন করা
৩. দুটি ইভেন্ট হ্যান্ডলারের মাধ্যমে ক্যাপচা কোড পুনরায় রিলোড করা
৪. ওয়েবপেজের উপরে ডিজিটাল ঘড়ি প্রদর্শন
৫. দুটি বাটন সংযুক্ত করা, যেখানে একটিতে ক্লিক করলে একটি নির্দিষ্ট সময় অন্তর অন্তর স্বয়ংক্রিয়ভাবে ক্যাপচা কোড অটো রিলোড করা সম্ভব এবং দ্বিতীয় বাটনটিতে ক্লিক করলে ক্যাপচা কোড রিলোড হওয়া বন্ধ হয়ে যাবে।

ফর্ম পূরণ করার জাভাস্ক্রিপ্ট ট্রিক

/* Form filling javascript code */
  document.querySelector('option[title=BANGLADESH-DHAKA]').value = 'BGDD1';
  document.OnlineForm.pia.value = 'BGDD1'; // Note: Value of Indian Mission Name
  document.OnlineForm.fileno.value = 'XXXXXXXXXXXX'; // Note: Value of Application Id
  document.OnlineForm.birthdate.value = 'DD/MM/YYYY'; // Note: Value of Date of birth
  document.OnlineForm.passport_no.value = 'XXXXXXXXX'; // Note: Value of Passport No.
  var today = new Date(),
  dd = today.getDate(),
  mm = today.getMonth() + 1, // January is 0!
  yyyy = today.getFullYear();
  if (dd < 10) dd = '0' + dd;
  if (mm < 10) mm = '0' + mm;
  today = dd + '/' + mm + '/' + yyyy;
  document.OnlineForm.Date.value = today; // Note: Value of Today's date
  console.log('1) All input field has been filled out.');

এখানে উল্লেখ্য যে, আমি প্রথমে ২য় অপশন এলিমেন্টকে একটি BGDD1 ভ্যালু দিয়েছি, তারপর আমি পুনরায় এই BGDD1 ভ্যালুকেই pia সেলেক্ট এলিমেন্টের ভ্যালুতে অ্যাসাইন করেছি। আপনি যখন উপরের কোডগুলি ইন্সপেক্ট এলিমেন্ট এর কন্সোল প্যানেলে এন্টার করবেন, তখন সমস্ত ভিসার ফর্ম পূরণ হয়ে যাবে স্বয়ংক্রিয়ভাবে।

এখানে একটা ব্যাপারে আপনাকে আগে থেকেই জানিয়ে রাখছি যে আমি document.OnlineForm.fileno = “XXXXXXXX…” করে রেখেছি, আপনাকে শুধু ঐ সমস্ত ভ্যালু গুলিকে আগে থেকেই পুরণ করে রাখতে হবে কোন টেক্সট এডিটর দিয়ে।

ওয়েবপেজে গেট অ্যাপয়েন্টমেন্ট বাটন প্রদর্শন

রিপ্রিন্ট ওয়েবপেজটি যখন আপনি খুলবেন তখন Reprint বাটন আগে থেকেই ওয়েবপেজে চলে আসে, কিন্তু Get Appointment বাটনটা দেখায় না, আমাদেরকে মিশন নেমটা সিলেক্ট করে Get Appointment এর button টা নিয়ে আসতে হয়। কিন্তু নিচের কোডটি কনসোল প্যানেলে এন্টার করলে Get Appointment এর button টা চলে আসবে আর Reprint button-টি দেখাবে না।

/* Displaying Appointment Date by default */
document.querySelector('input[name=Reprint]').style.display = 'NONE';
var getAptBtn = document.querySelector('input[name=Appointment]');
getAptBtn.style.display = 'BLOCK';
getAptBtn.style.marginLeft = '170px';
console.log('2) Reprint button has been removed, Appointment button is now visible');

দুটি ইভেন্ট হ্যান্ডলারের মাধ্যমে ক্যাপচা কোড রিলোড

এই জাভাস্ক্রিপ্ট কোড দুটি কাজ করবে যেটার কাজ একটাই, ক্যাপচা কোড রিলোড করা। অর্থাৎ, আপনি যখন মাউসটি ঐ ক্যাপচা ইমেজ কোডের উপরে রাখবেন তখন ক্যাপচা কোডটি রিলোড হবে, আর আপনি যখন এক্সেস কোড লেখার ইনপুট ফিল্ডের উপর ক্লিক করবেন তখনো ক্যাপচা কোড রিলোড হবে।

/* Reloading captcha code with two event handler */
document.querySelector('#capt').onmouseover = function () {
return refreshCaptcha();
}
document.querySelector('#ImgNum').addEventListener('focus', function () {
return refreshCaptcha();
});
console.log('3) Two event handler has been added for reloading captcha code.');

ওয়েবপেজের উপরে ডিজিটাল ঘড়ি প্রদর্শন

এই জাভাস্ক্রিপ্ট কোড appointment date প্রয়োগের জন্য প্রযোজ্য নয়,  কিন্তু ওয়েব পেজের উপরে আপনার স্থানীয় সময় Chek করতে আপনাকে সাহায্য করবে।

var divClock = document.createElement('div'),
time;
document.body.insertBefore(divClock, document.body.firstChild);
divClock.setAttribute('style', 'font-size: 4em;background: #000;color: #fff;padding: 12px 10px;text-align: center;width: 100%; margiin: 0 auto;');
function showClock() {
var localTime = new Date().toLocaleTimeString();
setTimeout(showClock, 500);
divClock.innerHTML = localTime;
}
showClock();
console.log('4) Clock has been loaded on top');

দুটি বাটন সংযুক্ত করা, যার একটিতে ক্লিক করলে একটি নির্দিষ্ট সময় অন্তর অন্তর ক্যাপচা কোড অটো রিলোড হবে এবং বন্ধ করে দেওয়াও যাবে

এটা খুবই উপকারী জাভাস্ক্রিপ্ট কোড ক্যাপচা কোডটিকে অটোরিলোড করবার জন্য যেখানে আপনাকে ম্যানুয়ালি ক্যাপচা রিলোডের জন্য ক্লিক করতে হবে না, এই ফাংশনটাই আপনার জন্য একটি নির্দিষ্ট সময় অন্তর অন্তর ক্যাপচা ইমেজ রিলোড করতে সাহায্য করবে।
এই স্ক্রিপ্ট দুটি button এলিমেন্ট তৈরি করবে যেখানে। প্রথম button-টিতে ক্লিক করলে একটি নির্দিষ্ট সময় অন্তর ক্যাপচা কোড রিলোড করবে। আমি একটি delay ভ্যারিয়েবল তৈরী করেছি এবং এর ভ্যালু দিয়েছি ৩*১০০০ যেখানে ১০০০ হল মিলিসেকেন্ড(১০০০ মিলিসেকেন্ড = ১ সেকেন্ড)। অর্থাৎ আমি ৩ সেকেন্ড করে দিয়েছি। আপনাকে এই ভ্যালুটাকে আপনার পছন্দের সময় অনুযায়ী পরিবর্তন করে করে নিতে হবে। উদাহরণ স্বরূপ ধরুন আপনি প্রতি ১ মিনিট অন্তর অন্তর ক্যাপচা কোড রিলোড করবেন, তাহলে আপনাকে লিখতে হবে, ১*৬০*১০০০

var btnWrapper = document.createElement('div'),
delay = (3 * 1000), // declare how many seconds the captcha reloads in 
time,
btnClass = 'btn btn-primary',
btn1 = document.createElement('button'),
btn2 = document.createElement('button');
document.body.insertBefore(btnWrapper, document.body.firstChild);
btnWrapper.appendChild(btn1);
btnWrapper.appendChild(btn2);
btn1.setAttribute('class', btnClass);
btn2.setAttribute('class', btnClass);
btn1.appendChild(document.createTextNode('Start Reloading'));
btn1.setAttribute('style', 'margin-right: 8px;')
btn2.appendChild(document.createTextNode('Stop Reloading'));
btnWrapper.setAttribute('style', 'padding: 12px 10px; text-align: right; width: 60%; margin: 0 auto; margin-bottom: 10px;');

function autoClick() {
 document.querySelector('a').click();
 time = setTimeout(autoClick, delay);
}
btn1.addEventListener('click', function () {
 autoClick();
 console.log('Auto reload Success.');
});
btn2.addEventListener('click', function () {
 clearTimeout(time);
 console.log('Auto reload stopped');
});
console.log('5) Auto reload button has been added on top.');

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

try {
  /* Form filling javascript code */
  document.querySelector('option[title=BANGLADESH-DHAKA]').value = 'BGDD1';
  document.OnlineForm.pia.value = 'BGDD1'; // Note: Value of Indian Mission Name
  document.OnlineForm.fileno.value = 'XXXXXXXXXXXX'; // Note: Value of Application Id
  document.OnlineForm.birthdate.value = 'DD/MM/YYYY'; // Note: Value of Date of birth
  document.OnlineForm.passport_no.value = 'XXXXXXXXX'; // Note: Value of Passport No.
  var today = new Date(),
  dd = today.getDate(),
  mm = today.getMonth() + 1, // January is 0!
  yyyy = today.getFullYear();
  if (dd < 10) dd = '0' + dd;
  if (mm < 10) mm = '0' + mm;
  today = dd + '/' + mm + '/' + yyyy;
  document.OnlineForm.Date.value = today; // Note: Value of Today's date
  console.log('1) All input field has been filled out.');
  /* Displaying Appointment Date by default */
  document.querySelector('input[name=Reprint]').style.display = 'NONE';
  var getAptBtn = document.querySelector('input[name=Appointment]');
  getAptBtn.style.display = 'BLOCK';
  getAptBtn.style.marginLeft = '170px';
  console.log('2) Reprint button has been removed, Appointment button is now visible');
  /* Reloading captcha code with two event handler */
  document.querySelector('#capt').onmouseover = function () {
    return refreshCaptcha();
  }
  document.querySelector('#ImgNum').addEventListener('focus', function () {
    return refreshCaptcha();
  });
  console.log('3) Two event handler has been added for reloading captcha code.');
  /* Displaying clock on top */
  var divClock = document.createElement('div'),
  time;
  document.body.insertBefore(divClock, document.body.firstChild);
  divClock.setAttribute('style', 'font-size: 4em;background: #000;color: #fff;padding: 12px 10px;text-align: center;width: 100%; margiin: 0 auto;');
  function showClock() {
    var localTime = new Date().toLocaleTimeString();
    setTimeout(showClock, 500);
    divClock.innerHTML = localTime;
  }
  showClock();
  console.log('4) Clock has been loaded on top');
  /* Viewing a button which will reload the captcha code */
  var btnWrapper = document.createElement('div'),
  delay = (3 * 1000), // declare how many seconds the captcha reloads in 
  time,
  btnClass = 'btn btn-primary',
  btn1 = document.createElement('button'),
  btn2 = document.createElement('button');
  document.body.insertBefore(btnWrapper, document.body.firstChild);
  btnWrapper.appendChild(btn1);
  btnWrapper.appendChild(btn2);
  btn1.setAttribute('class', btnClass);
  btn2.setAttribute('class', btnClass);
  btn1.appendChild(document.createTextNode('Start Reloading'));
  btn1.setAttribute('style', 'margin-right: 8px;')
  btn2.appendChild(document.createTextNode('Stop Reloading'));
  btnWrapper.setAttribute('style', 'padding: 12px 10px; text-align: right; width: 60%; margin: 0 auto; margin-bottom: 10px;');
  function autoClick() {
    document.querySelector('a').click();
    time = setTimeout(autoClick, delay);
  }
  btn1.addEventListener('click', function () {
    autoClick();
    console.log('Auto reload Success.');
  });
  btn2.addEventListener('click', function () {
    clearTimeout(time);
    console.log('Auto reload stopped');
  });
  console.log('5) Auto reload button has been added on top.');
} catch (e) {
  console.log('There was an error:' + e);
}

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

স্ক্রিপ্ট ডাউনলোড

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