Web arayüzü geliştirme yardım(taktik ihtiyacı)

İnputun içinde required yazıyor. Onu kaldırınca düzelmesi lazım.
 
  • Beğen
Reactions: nt
nt dedi ki:
o parola ya da kullanıcı adının zorunlu olması değilmi kodumu ekliyorum Ustaaaaa :D help sos
HTML: 
<!DOCTYPE html>
<html lang="tr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="shortcut icon" type="image/x-icon" href="{% static 'favicon.ico' %}">
    <title>Giriş Sayfası</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: Arial, Helvetica, sans-serif;
        }
        body {
            background: url('/home/n/Desktop/3.jpg') no-repeat center center fixed;
            background-size: cover;
        }
        .container {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
        }
      
        .form {
            background-color: #ffffffe1;
            padding: 40px;
            border-radius: 5px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
            width: 400px;
        }
      
        .form-title {
            font-size: 24px;
            font-weight: bold;
            margin-bottom: 20px;
            text-align: center;
        }
      
        .form-group {
            margin-bottom: 20px;
        }
      
        .form-group label {
            display: block;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }
      
        .form-group input {
            width: 100%;
            padding: 10px;
            font-size: 16px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }
      
        .form-group .password-group {
            position: relative;
        }

        .form-group .password-group input {
            width: calc(100% - 30px);
        }

        .form-group .password-group .password-toggle {
            cursor: pointer;
            position: absolute;
            top: 10px;
            right: 10px;
        }

        .form-group input[type="submit"] {
            background-color: #333;
            color: #fff;
            cursor: pointer;
        }
      
        .form-group input[type="submit"]:hover {
            background-color: #555;
        }
      
        .form-group .form-text {
            font-size: 14px;
            color: #888;
            margin-top: 5px;
        }
    </style>
</head>
<body>
    <div class="container">
        <form class="form" action="{% url 'login' %}" method="POST" onsubmit="return validateForm()">
            {% csrf_token %}
            <h2 class="form-title">Kullanıcı Girişi</h2>
            <div class="form-group">
                <label for="username">Kullanıcı Adı veya E-posta:</label>
                <input type="text" id="username" name="username" required>
            </div>
            <div class="form-group">
                <label for="password">Şifre:</label>
                <div class="password-group">
                    <input type="password" id="password" name="password" required>
                    <span class="password-toggle" onclick="togglePasswordVisibility()">&#128584;</span>
                </div>
            </div>
            <div class="form-group">
                <input type="submit" value="Giriş Yap">
                <p class="form-text">Hesabınız yok mu? <a href="{% url 'register' %}">Kaydol</a></p>
            </div>
        </form>
    </div>

    <script>
        function togglePasswordVisibility() {
            var passwordField = document.getElementById('password');
            if (passwordField.type === 'password') {
                passwordField.type = 'text';
            } else {
                passwordField.type = 'password';
            }
        }
        function validateForm() {
            var usernameField = document.getElementById('username');
            var passwordField = document.getElementById('password');

            if (usernameField.value.trim() === '' || passwordField.value.trim() === '') {
            alert('Kullanıcı adı ve şifre boş olamaz.');
            return false;
    }

           
            if (passwordField.value.trim().length < 6) {
            alert('Şifre en az 6 karakter olmalıdır.');
            return false;
    }

    return true;
}
    </script>
</body>
</html>
Genişletmek için tıklayın...
Aynı şey işte. Boş olamaz anlamına geliyor. Eğer sen js ile yaptıysan ona gerek yok.
 
  • Beğen
Reactions: nt
Böyle tek HTML dosyasına hem HTML, hem CSS, hem de javascript tıkılmaz yav :cheeky5:code penceresi bile kafayı yemiş, nasıl renklendireceğini bilememiş.

Bunların hepsi ayrı dosyalara konur. index.html, osm.css, osm.js. Sonra da HTML dosyasında bunları tanıtırsın

HTML: 
<!DOCTYPE html>
<html lang="en-US">
  <head>
    <title>OSM</title>
    <script type="text/javascript" src="osm.js"></script>
    <link type="text/css" rel="stylesheet" href="osm.css">
  </head>
  <body>
      ......
  </body>
</html>
 
nt dedi ki:
req. sildiğimde ekranın ortasında kocaman uyarı cıkıyor böyle devam zaten timur abi diyordur hayırdır maymunlar falan :D :D :D
Genişletmek için tıklayın...
O maymunlara bende takıldım da sorunu çözdükten sonra dillendirecektim. :D
 
  • Haha
Reactions: nt
nt dedi ki:
Biraz öğreniyim abi, onları başaramam şuanda ancak bu şekilde.
Genişletmek için tıklayın...
Onda bir şey yok yav. Timur abi zaten hazır kodu vermiş. Yeni bir sayfa açacaksın. Sonuna .html yerine .js yazacaksın. İçinede js kodlarını yapıştırıp kaydedeceksin o kadar. Css de aynı.
 
  • Beğen
Reactions: nt
nt dedi ki:
abi aslında istediğimi yapamadım aslında :
şifre ******* iken gözünü kapatan maymun
şifre aaaaa iken agzını kapatan maymun du olmadı nasip artık :D
Genişletmek için tıklayın...
Şifreyi yazarken tek gozunu aralayan durunca kapatan maymun da yapabilirsin :katil2:
 
  • Haha
Reactions: nt
böyle bir örnek var ama uzun gözüküyor önce bi proje bitsin de sonra ugrasmak istersen :katil2:
 
  • Haha
Reactions: nt
özdisan.png
 
  • Beğen
Reactions: nt
nt dedi ki:
@Gokrtl css usta sayfadan taşıyor tablo, resim dersinide sevmezim zaten :D
Genişletmek için tıklayın...
İşte bunun için Farnelin Özdisan ın web sitelerinde herbir field(Alan ) için kaç karakter ayrılmış incelemeniz lazım
Örneğin aşağıdaki Adet kısmına neredeyse 20 karakter/sayılık alan alan ayrılmış.Oysa ençok 8 karakter(99 999 999 Yani doksandokuz milyo dokuzyüzdpksandokuz bin dokuzyüz doksandokuz adet) yeterde artar bile
Ayrıca Field verilen ismi başka ,Name kısmı başka tanımlanabilir.Yani o kadar uzun ismin ekranda görünmesine gerek yok
Buna göre tüm fieldlara uygun genişlikler tanımlayın

mıktar.png
 
Son düzenleme:
Bu program ne iş görecek?
Kişinin elindeki komponentlerin sayısını gösterecek.Aradığı bir malzemeyi internetteki online sitelerden bulacak
Farnell Amerikan komponent satıcısı,yapılmak istenen programın mükemmeli adamların web sitesinde çalışır durumda var,Özdisasan da meşhur bir türk komponent tedarikçisi onda da çalışan örnek var.

Field (Alan/saha) Veritabanı fieldlarlardan oluşur, Bunlar Nümerik,Alfnumeric,Memo,Logic vs birçok türde olabilir.programcı bunun adını ,türünü ve genişliğini tanımlar.
Örneğin :
PERSONEL.DB
personel_name ... Character.......25
personel_surname....Character....25
personel_name programlamada kod satırında derleyicinin database de aradığı isimdir
Name satıırında ekranda siz Buna "Pers.Ad/Soyad" gibi ona ayrılan şekilde kısaltabilirsiniz
Eğer siz Personel Ada 255 karakter soyadada 255 karakter ayırırsanız o bilgi ekrana sığmaz

@nt
Mesela @taydın veritabanınıda ,fieldlarıda anahtarlarıda tasarlamış işte
Fieldların adı uzunluğu da tanımlanmış demektir size o kadar ekranda alan ayıracaksınız

https://mekatronik.org/forum/threads/komponent-stok-takip-sistemi-icin-veritabani-tasarimi.4588/
 
Son düzenleme:
@taydin a soracaksınız hangi fieldlar,hangi bilgilere karşılık ,türü ne ?,kaç karakter ayrıldı
Alanların soldan sağa hangi sırada olması mantıklı olur o karar verilecek ,tepesinde yazan türkçe adlandırmalara karar verilecek

Programda da trim Component_name 18 falan gibi bir syntaxla bu isimleri aralarında ;(nortalı virgülü olur ,yoksa göreselmi olur teker teker yazacaksınız
 
%30 küçültmekle bu sorunlar aşılmaz
Excelde mesela soldaki bazı alanları kilitlersiniz o bilgi örneğin malzeme kodu sabir kalır,satırı sağa doğru kaydırırsınız hepsini görürsünüz
 
özdisan sizin uğraştığınız programın örneği web sitesinde olan firma ,tıpkı farnell veya mouser gibi
Anlamak için onların sitelerinde her bir bilgiye kaç karakter ayırmışlar bakın dedim
:)
 
@nt Her zaman basitten zora gitmen lazim. Sen en başta en zoru yapmaya çalışıyorsun.

Her bir sütun için mantıklı bir alan ayır ve tek satırda komponent parametrelerini yazdır. Tarayıcı zaten yatay scroll bar koyacak, sağdaki alanlara bakmak isteyen scroll etsin sağa.

Sorgu için de özdisan, mouser, digikey deki filtrelere gerek yok şu anda. Tek bir input box'ta SQL sorguyu yazalım. Sorgunun altında da komponentler listelensin.
 
Yav ben zaten filtreleri için söylemiyorum.Orada herbir farklı komponent için bile farklı filitreler var
Ben kaçar karakter ayrılmış ona bak diyorum
@nt işi yapmak istiyorda Veritabanı hakkında da çok bilgisi yok.
 
Zaten %90 sorguların şekli belli olacak. Tüm komponentleri listele

SQL: 
SELECT * from components

MOSFET lerimi listele

SQL: 
SELECT * from components WHERE category='MOSFET'
 
Omega dedi ki:
Ben kaçar karakter ayrılmış ona bak diyorum
Genişletmek için tıklayın...

Bakmaya da gerek yok. Komponent model numaralarını kafanda canlandır: BC547, CD4046, STM32F103C8T6. Kaç karakter aryırırsın? Ben 15 karakter yeter diyeyim, sen 20 karakter olması lazım de.
 
taydin dedi ki:
Bakmaya da gerek yok. Komponent model numaralarını kafanda canlandır: BC547, CD4046, STM32F103C8T6. Kaç karakter aryırırsın? Ben 15 karakter yeter diyeyim, sen 20 karakter olması lazım de.
Genişletmek için tıklayın...
Ben canlandırıyorumda Timur cum önemli olan @nt nin canlandırması:katil1:
 
Cevaplamak için giriş yap veya kayıt ol.

Çevrimiçi personel

Çevrimiçi üyeler

Toplam: 72 (üye: 18, misafir: 54)
Robotlar: 334

Forum istatistikleri

Konular
5,842
Mesajlar
99,660
Üyeler
2,480
Son üye
mozcelikors

Bu sayfayı paylaş

Son kaynaklar

Son profil mesajları

S
stratus
gruptaki arkadaşlara selamlar. sıteyi bu gün fark ettim. Asansör için 2x7 segment LCD gösterge üretmek istiyorum. acaba bu sayfadaki arkadaşlardan destek alabilirmiyim. LCD nin mantık açılımı ektedir.
•••
D
deneyci wrote on TA3UIS's profile.
Selam.
Amatör telsiz lisansı nasıl alınıyor?
Lisansı olmayanı forumlarına almıyorlar. :)
Bilgi alamıyoruz.
•••
C
cemalettin keçeci wrote on HaydarBaris's profile.
barış kardeşim bende bu sene akıllı denizaltı projesine girdim ve sensörleri arastırıyorum tam olarak hangi sensör ve markaları kullandınız yardımcı olabilir misin?
•••
M
m.white wrote on Altair's profile.
İyi akşamlar.Arabanız ne marka ve sorunu nedir.Ben araba tamircisi değilim ama tamirden anlarım.
•••
A
asicocuk34
* En mühim ve feyizli vazifelerimiz millî eğitim işleridir. Millî eğitim işlerinde mutlaka muzaffer olmak lâzımdır. Bir milletin hakikî kurtuluşu ancak bu suretle olur. (1922)
•••
Back
Top