اذهب إلى المحتوى

السؤال

Recommended Posts

  • 0
نشر (معدل)

<div id="Contact" class="tabcontent">



<div class="container">

  <form action="ashera.php">

    <label for="usrname">Username</label>

    <input type="text" id="usrname" name="usrname" required>



    <label for="psw">Password</label>

    <input type="password" id="psw" name="psw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain at least one number and one uppercase and lowercase letter, and at least 8 or more characters" required>

    

    <input type="submit" value="login" name="login">

  </form>



</div>



<div id="message">

  <h3>Password must contain the following:</h3>

  <p id="letter" class="invalid"><b>lowercase</b> letter</p>

  <p id="capital" class="invalid"><b>capital (uppercase)</b> letter</p>

  <p id="number" class="invalid"><b>number</b></p>

  <p id="length" class="invalid">Minimum <b>8 characters</b></p>

</div>

        

<script>

var myInput = document.getElementById("psw");

var letter = document.getElementById("letter");

var capital = document.getElementById("capital");

var number = document.getElementById("number");

var length = document.getElementById("length");





myInput.onfocus = function() {

  document.getElementById("message").style.display = "block";

}





myInput.onblur = function() {

  document.getElementById("message").style.display = "none";

}





myInput.onkeyup = function() {

  // Validate lowercase letters

  var lowerCaseLetters = /[a-z]/g;

  if(myInput.value.match(lowerCaseLetters)) {  

    letter.classList.remove("invalid");

    letter.classList.add("valid");

  } else {

    letter.classList.remove("valid");

    letter.classList.add("invalid");

  }

  

  // Validate capital letters

  var upperCaseLetters = /[A-Z]/g;

  if(myInput.value.match(upperCaseLetters)) {  

    capital.classList.remove("invalid");

    capital.classList.add("valid");

  } else {

    capital.classList.remove("valid");

    capital.classList.add("invalid");

  }



  // Validate numbers

  var numbers = /[0-9]/g;

  if(myInput.value.match(numbers)) {  

    number.classList.remove("invalid");

    number.classList.add("valid");

  } else {

    number.classList.remove("valid");

    number.classList.add("invalid");

  }

  

  // Validate length

  if(myInput.value.length >= 8) {

    length.classList.remove("invalid");

    length.classList.add("valid");

  } else {

    length.classList.remove("valid");

    length.classList.add("invalid");

  }

}

</script>



</div>

  

 

تم التعديل في بواسطة أحمد حبنكة
وضع الكود ضمن محرر الكود
  • 0
نشر (معدل)
بتاريخ On 7‏/1‏/2021 at 18:25 قال Samah Mohmmed:


<div id="Contact" class="tabcontent">



<div class="container">

  <form action="ashera.php">

    <label for="usrname">Username</label>

    <input type="text" id="usrname" name="usrname" required>



    <label for="psw">Password</label>

    <input type="password" id="psw" name="psw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain at least one number and one uppercase and lowercase letter, and at least 8 or more characters" required>

    

    <input type="submit" value="login" name="login">

  </form>



</div>



<div id="message">

  <h3>Password must contain the following:</h3>

  <p id="letter" class="invalid"><b>lowercase</b> letter</p>

  <p id="capital" class="invalid"><b>capital (uppercase)</b> letter</p>

  <p id="number" class="invalid"><b>number</b></p>

  <p id="length" class="invalid">Minimum <b>8 characters</b></p>

</div>

        

<script>

var myInput = document.getElementById("psw");

var letter = document.getElementById("letter");

var capital = document.getElementById("capital");

var number = document.getElementById("number");

var length = document.getElementById("length");





myInput.onfocus = function() {

  document.getElementById("message").style.display = "block";

}





myInput.onblur = function() {

  document.getElementById("message").style.display = "none";

}





myInput.onkeyup = function() {

  // Validate lowercase letters

  var lowerCaseLetters = /[a-z]/g;

  if(myInput.value.match(lowerCaseLetters)) {  

    letter.classList.remove("invalid");

    letter.classList.add("valid");

  } else {

    letter.classList.remove("valid");

    letter.classList.add("invalid");

  }

  

  // Validate capital letters

  var upperCaseLetters = /[A-Z]/g;

  if(myInput.value.match(upperCaseLetters)) {  

    capital.classList.remove("invalid");

    capital.classList.add("valid");

  } else {

    capital.classList.remove("valid");

    capital.classList.add("invalid");

  }



  // Validate numbers

  var numbers = /[0-9]/g;

  if(myInput.value.match(numbers)) {  

    number.classList.remove("invalid");

    number.classList.add("valid");

  } else {

    number.classList.remove("valid");

    number.classList.add("invalid");

  }

  

  // Validate length

  if(myInput.value.length >= 8) {

    length.classList.remove("invalid");

    length.classList.add("valid");

  } else {

    length.classList.remove("valid");

    length.classList.add("invalid");

  }

}

</script>



</div>

  

 

مرحبا @Samah Mohmmed

أرى أنك قد أنتهيت فعلا من البرمجة الأمامية لمشروعك ولكن ما زال لديك شغف وهو ربط مشروعك بقاعدة بيانات من خلال أستخدام لغة برمجة PHP. 

أولا يجب ان تقوم بأنشاء ملف ashera.php لانه قمت بوضع في خاصية action في الفورم أن البيانات سترسل إلى ملف ashera.php و أود تنبيهك على أن يجب أن تحدد طريقة أرسال البيانات أما POST , GET عن طريق خاصية method="POST" أو method="GET" عن طريق أضافة هذه الخاصية إلى الكود التالي  

<form action="ashera.php">
ليصبح 
<form action="ashera.php" method="POST">
  أو 
<form action="ashera.php" method="GET">

عند أنشائك لملف ashera.php يجب كتابة ما يلي بداخله 

<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "myDB";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
  die("Connection failed: " . $conn->connect_error);
}

$usrname = $_POST['usrname'];
$psw = $_POST['psw'];

$sql = "INSERT INTO MyGuests (usrname, psw)
VALUES ('$usrname', '$psw')";

if ($conn->query($sql) === TRUE) {
  echo "New record created successfully";
} else {
  echo "Error: " . $sql . "<br>" . $conn->error;
}

$conn->close();
?>

 

تم التعديل في بواسطة بلال زيادة

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...