shaba

اعتبار سنجی شماره شبا، شماره کارت و تشخیص بانک (به همراه تصویر)

پیشنمایش: کلیک کنید - جایگذین | نسخه به همراه jquery در codepen

contribution: create pull/merge request on branch name shaba{weeknumber}{month}{year}

<!-- نمایش لوگوی بانک کارت -->
<img width="32px" id="cardBankLogo" src="https://cdn.jsdelivr.net/gh/smohamadabedy/shaba@latest/bank-iran/no-img.png"><span id="cardName"></span>

<!-- ورودی شماره کارت (با جهت چپ به راست برای اعداد) -->
<input type="text" id="cardInput" class="creditcart-input" style="direction:ltr" placeholder="شماره کارت را وارد کنید">

<!-- نمایش لوگوی بانک شبا -->
<img width="32px" id="shabaBankLogo" src="https://cdn.jsdelivr.net/gh/smohamadabedy/shaba@latest/bank-iran/no-img.png"><span id="shabaName"></span>

<!-- ورودی شماره شبا -->
<input type="text" id="shabaInput" class="shaba-input" style="direction:ltr" placeholder="کد شبا را وارد کنید">

<script src="https://cdn.jsdelivr.net/gh/smohamadabedy/shaba@latest/dist/shaba.min.js"></script>

<script type="text/javascript">
  // گرفتن المان‌های ورودی از صفحه
  const $card = document.getElementById('cardInput');
  const $shaba = document.getElementById('shabaInput');

  // وقتی شماره کارت تغییر می‌کند:
  $card.addEventListener('input', function () {
    const card = shaba.convertPersianToEnglishDigits(this.value); // تبدیل ارقام فارسی به انگلیسی
    const isValid = shaba.validateCard(card);                     // بررسی اعتبار کارت بانکی با الگوریتم Luhn
    const prefix = card.slice(0, 6);                              // گرفتن ۶ رقم اول کارت
    const bank = shaba.getBankFromCard(prefix);                  // گرفتن اطلاعات بانک از روی شماره کارت

    // تغییر تصویر لوگوی بانک
    document.getElementById('cardBankLogo').src =
      "https://cdn.jsdelivr.net/gh/smohamadabedy/shaba@latest/bank-iran/" + bank[0] + ".png";
    
       document.getElementById('cardName').innerHTML =  bank[2];  //نمایش نام بانک

    // رنگ حاشیه را سبز یا قرمز نمایش بده بر اساس اعتبار کارت
    this.style.borderColor = isValid ? 'green' : 'red';
  });

  // وقتی شبا تغییر می‌کند:
  $shaba.addEventListener('input', function () {
    // پاکسازی شبا از - و تبدیل اعداد فارسی/عربی به انگلیسی
    const input = shaba.convertPersianToEnglishDigits(this.value.toUpperCase().replace(/-/g, ''));

    const code = input.slice(2, 5);                               // استخراج کد بانک از شبا
    const bank = shaba.getBankFromShaba(code);                   // گرفتن اطلاعات بانک از شبا

    // تغییر تصویر لوگوی بانک
    document.getElementById('shabaBankLogo').src =
      "https://cdn.jsdelivr.net/gh/smohamadabedy/shaba@latest/bank-iran/" + bank[0] + ".png";

   	    document.getElementById('shabaName').innerHTML =  bank[1]; //نمایش نام بانک

    // آماده‌سازی و اعتبارسنجی با استاندارد ISO 7064 (Mod97)
    const prepared = shaba.iso13616Prepare(input);
    const valid = shaba.iso7064Mod97_10(prepared) === 1;

    // رنگ حاشیه ورودی را مشخص کن
    this.style.borderColor = valid ? 'green' : 'red';
  });
</script>