맞춤 팝업을 만드는 방법은 무엇입니까?

Question

맞춤 팝업을 만드는 방법. 가장 중요한 닫기 버튼

없이 여기에 코드를 조금

if (empty($username) || empty($password) || empty($email) || empty($phone_no) ||empty($curr_state) || empty($curr_loc)){</br> 
echo("<script> alert('Fill in details')</script>"); 
} 
else{ 
if(strlen($password)>40){ 
    echo("<script> alert('Password is too long')</script>"); 
} 
else{ 
$insert = 'INSERT INTO user(username , password , email , phone_number , curr_state , curr_loc) VALUES ("'.$username.'", "'.$password.'" , "'.$email.'" , "'.$phone_no.'" , "'.$curr_state.'" , "'.$curr_loc.'")'; 
mysql_query($insert); 
echo("<script> alert('Registration Successful')</script>"); 

Answer 1

난 당신이 bootstrap 같은 CSS/HTML 템플릿 시스템을 조사 제안합니다. 그들은 팝 업과 경고를하는 방법에 대한 정말 멋진 샘플을 제공합니다.

또한 자바 스크립트에서 양식 데이터를 확인한 후 고유 한 사용자 이름이나 이메일 주소와 같은 추가 유효성 검사를 위해 양식을 서버에 전송하는 것이 좋습니다.

이렇게하면 자바 스크립트에서 부트 스트랩과 같은 템플릿을 호출 할 수 있습니다. HTML

<form name="registration"> 
    <input type="text" name="username"/> 
    <input type="submit" onclick="validateform()">register!</input> 
</form> 
<div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button 
     <h3 id="myModalLabel">Modal header</h3> 
    </div> 
    <div class="modal-body"> 
     <p>One fine body…</p> 
    </div> 
    <div class="modal-footer"> 
     <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
     <button class="btn btn-primary">Save changes</button> 
    </div> 
</div> 

예 : 다음 코드는 난 그냥 당신에게 아이디어를주는거야

예를 컴파일되지 않습니다 JS

function validateform() { 
    var name = document.form.registration.username; 
    //validate name... 
    // if name is valid then submit with $.ajax 
    // else call bootstrap modal like $('#myModal').modal('show') 
}