|
Poslao: 12 Jul 2015 17:09
|
offline
- dejnik978
- Zaslužni građanin
- Pridružio: 25 Mar 2015
- Poruke: 548
|
Postovanje, uradio sam proveru validnosti podataka forme putem javascripta-jquery, u pitanju je modal login . Sad sam poceo da ucim jquery pa me zanima sledece ako stavim npr radi vezbe jedan modal login i jednu obicnu registracionu formu sa istom jquery skriptom sa id="login" zasto ne rade istu proveru. Kad promenim id="login" i id="login2" rade. Da me ne shvatite pogresno id je identifikator i vazi samo sa jedan slucaj ne moze se primeniti na dva za to se koristi klasa. Da li da stavim clasu umesto identifikatora, kako se tada ponasa jquery skripta?
Probao sam ako stavim class-u na obicnu registracionu formu radi jquery provera validnosti unetih podataka a na modal ne radi, zato izgleda da bi obe radile mora da se koriste identifikatori id="login" i id="login2"
Evo skripte nije moja ja sam povezao sve pojedinacne delove u celinu i pokrenuo i sve radi. Pa ko hoce neka proba
$(document).ready(function(){
$("#myBtn").click(function(){
$("#myModal").modal();
});
});
$(document).ready(function(){
$("#login2").click(function(){
var email = $("#email").val();
var password = $("#password").val();
// Checking for blank fields.
if( email =='' || password ==''){
$('input[type="text"],input[type="password"]').css("border","2px solid red");
$('input[type="text"],input[type="password"]').css("box-shadow","0 0 3px red");
alert("Please fill all fields...!!!!!!");
}else {
$.post("login.php",{ email1: email, password1:password},
function(data) {
if(data=='Invalid Email.......') {
$('input[type="text"]').css({"border":"2px solid red","box-shadow":"0 0 3px red"});
$('input[type="password"]').css({"border":"2px solid #00F5FF","box-shadow":"0 0 5px #00F5FF"});
alert(data);
}else if(data=='Email or Password is wrong...!!!!'){
$('input[type="text"],input[type="password"]').css({"border":"2px solid red","box-shadow":"0 0 3px red"});
alert(data);
} else if(data=='Successfully Logged in...'){
$("form")[0].reset();
$('input[type="text"],input[type="password"]').css({"border":"2px solid #00F5FF","box-shadow":"0 0 5px #00F5FF"});
alert(data);
} else{
alert(data);
}
});
}
});
});
html
<div class="container">
<div class="row">
<div class="col-xs-12 col-md-12">
<h3>Prijava</h3>
<p>Da biste ucestvovali u diskusiji morate se prijaviti
<button type="button" class="btn btn-success btn-sm" id="myBtn">ovde</button>
ili se registrovati ovde <button type="button" class="btn btn-info btn-sm disabled" id="myBtn">Registracija</button></p>
<!-- Modal -->
<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header" style="padding:35px 50px;">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4><span class="glyphicon glyphicon-lock"></span> Login</h4>
</div>
<div class="modal-body" style="padding:40px 50px;">
<form role="form">
<div class="form-group">
<label for="usrname"><span class="glyphicon glyphicon-user"></span> Username</label>
<input type="text" class="form-control" id="usrname" placeholder="Enter email">
</div>
<div class="form-group">
<label for="psw"><span class="glyphicon glyphicon-eye-open"></span> Password</label>
<input type="text" class="form-control" id="psw" placeholder="Enter password">
</div>
<div class="checkbox">
<label><input type="checkbox" value="" checked>Remember me</label>
</div>
<button type="submit" class="btn btn-success btn-block" id="login2" value="Login"><span class="glyphicon glyphicon-off"></span> Login</button>
</form>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-danger btn-default pull-left" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> Cancel</button>
<p>Not a member? <a href="#">Sign Up</a></p>
<p>Forgot <a href="#">Password?</a></p>
</div>
</div>
</div>
</div>
<div class="main">
<form class="form" method="post" action="#">
<h2>Zdravo, molimo Vas da se prijavite</h2>
<label>Email :</label>
<input type="text" name="demail" id="email">
<label>Password :</label>
<input type="password" name="password" id="password">
<input type="button" name="login" id="login" value="Login">
</form>
</div><!--main-->
</div><!--col-4-->
</div><!--row-->
</div><div><!--container-->
php
<?php
$connection = mysql_connect("localhost", "root", ""); // Establishing connection with server..
$db = mysql_select_db("college", $connection); // Selecting Database.
$email=$_POST['email1']; // Fetching Values from URL.
$password= sha1($_POST['password1']); // Password Encryption, If you like you can also leave sha1.
// check if e-mail address syntax is valid or not
$email = filter_var($email, FILTER_SANITIZE_EMAIL); // sanitizing email(Remove unexpected symbol like <,>,?,#,!, etc.)
if (!filter_var($email, FILTER_VALIDATE_EMAIL)){
echo "Invalid Email.......";
}else{
// Matching user input email and password with stored email and password in database.
$result = mysql_query("SELECT * FROM registration WHERE email='$email' AND password='$password'");
$data = mysql_num_rows($result);
if($data==1){
echo "Successfully Logged in...";
}else{
echo "Email or Password is wrong...!!!!";
}
}
mysql_close ($connection); // Connection Closed.
?>
Pitanje se odnosi na to da trebam da kopiram dve skripte sa samo promenjenim imenima varijabli login i login2. Jedna za prijavu jedna za registraciju.
$("#login") i $("#login2")
Da li moze drugacije ili ovako?
Neko vase misljenje iz iskustva? Pozdrav i hvala.
|
|
|
|
|
Registruj se da bi učestvovao u diskusiji. Registrovanim korisnicima se NE prikazuju reklame unutar poruka.
|
|
|
|
|
Poslao: 14 Jul 2015 23:09
|
offline
- m4rk0
- Administrator
- Administrator tech foruma
- Marko Vasić
- Gladijator - Maximus Decimus Meridius
- Pridružio: 14 Jan 2005
- Poruke: 15766
- Gde živiš: Majur (Colosseum)
|
Da, preko medija querija smanji top/bottom padinge izmedju itema u navigaciji. Ako ne znas da se snadjes koji je tacno element, idi desni klik na neki od itema u meniju -> inspect element i tacno ce ti prikazati koji je element u pitanju i za njega smanji top/bottom padding (a mozda i margin, zavisi). Takodje po potrebi mozes i font smanjiti.
|
|
|
|
|
|
|
Poslao: 16 Jul 2015 01:11
|
offline
- dejnik978
- Zaslužni građanin
- Pridružio: 25 Mar 2015
- Poruke: 548
|
Napisano: 15 Jul 2015 21:17
Imam jedan problem sa kodom kad predjem preko naziva dropdown ceo menu se otvori, sto je lose. Treba da se otvori samo do Hover me more options i tek tada da mi se otvori drugi deo. Kad iskljucim jquery dropdown radi kako treba ali je ovako mnogo lepse ima dobar efekat.
kod jquery
$(function() {
//MAKE MENUS DROP AUTOMATICALLUY
$('ul.nav li.dropdown').hover(function()
{
$('.dropdown-menu', this).fadeIn();
}, function() {
$('.dropdown-menu', this).fadeOut('fast');
});//hover
});//jquery is loaded
|
|
|
|
|
|
|
|
|
Poslao: 16 Jul 2015 18:20
|
offline
- m4rk0
- Administrator
- Administrator tech foruma
- Marko Vasić
- Gladijator - Maximus Decimus Meridius
- Pridružio: 14 Jan 2005
- Poruke: 15766
- Gde živiš: Majur (Colosseum)
|
Citat:Da li da isti prebacim u media query ovako pa da podesim
Ne prebacujes sve vrednosti vec samo one koje hoces da zamenis (na pr hoces boju da promenis ti ces samo njen parametar staviti:
@media (max-width: 767px){
.dropdown-menu>li>a {
color: #fff!important;
}
}
Important sam stavio u slucaju da ne prihvati promenu i zapamti, ovo je samo primer, ne moras menjati boju.
Mada, ja sam mislio da smanjis padinge/margine kod glavnih li elemenata (ne od dropdowna). idi desni klik na ono LINK i inspect element i videces kom elementu pripada. iskoristi ga u medija queriju i smanji mu top/botom padding/margin.
|
|
|
|
|
|
|
Poslao: 16 Jul 2015 19:13
|
offline
- dejnik978
- Zaslužni građanin
- Pridružio: 25 Mar 2015
- Poruke: 548
|
Ok jasno, radi to je ovo, sad bi trebao i u okviru dropdowna da se sve smanji?
@media (max-width: 767px)
{
.navbar-nav>li>a {
padding-top: 1px;
padding-bottom: 1px;
line-height: 20px;
margin-left: 5px;
margin-right: 5px;
}
}
Da li je ovo u redu dodao sam i margine, smanjio sam padinge sve u svemu mozemo podesavati po zelji klijenata? Pozdrav
|
|
|
|
|
|
|
|
|
|
|
|
