Disable Close Modal on Outside Click
10,424
Solution 1
// for disable modal when click outside
$('#modalid').openModal({dismissible:false});
// remove modal-action modal-close in ok button
<a href="#" onClick="check_ganpass()" id="btn_ok" class="waves-effect waves-green btn-flat ">Edit</a>
// insert bellow "Materialize.toast('Data Telah Berubah',4000);"
$('modalid').closeModal();
hope that answer your question. :)
Solution 2
if you have only one modal, and are using jquery, you can do :
$('#myModal').modal()[0].M_Modal.options.dismissible = false;
$('#myModal').modal('open');
cheers
Solution 3
Try this
$('#ModalID').modal({
backdrop: 'static',
keyboard: false
})
or in html set data attributes as below
data-backdrop="static" data-keyboard="false"
on popup call
Hope this helps..
Author by
Sae
Learn to be good Hi, try this if you need VPS and some other feature also there
Updated on June 13, 2022Comments
-
Sae almost 2 years
I am making some blog that use modal(s) with Materializecss, but i have problem with my modal onclick outside and on the false data, here is my code:
main.js
function changepassword(){ var user = $('#userlog').val(); var content = ""; content += '<div id="modganpas" class="modal modal-fixed-footer">'; content += '<div class="modal-content">'; content += '<form>'; content += '<style="text-align:center;font-size:12px;font-weight:bold;"><h3>change Password</h3>'; content += '<div><i class="material-icons">supervisor_account</i>'; content += '</div>'; content += '<div class="row">'; content += '<div class="input-field col s12">'; content += '<input id="changeUsername" name="changeUsername" type="text" class="validate" disabled>'; content += '</div>'; content += '<div class="input-field col s12">'; content += '<input id="changePasswordold" maxlength="32" name="changePasswordold" type="password" class="validate">'; content += '<label for="changePasswordold">Password old</label></div>'; content += '<div class="input-field col s6">'; content += '<input id="changePasswordnew" maxlength="32" name="changePasswordnew" type="password" class="validate">'; content += '<label for="changePasswordnew">Password new</label></div>'; content += '<div class="input-field col s6">'; content += '<input id="changePasswordnew1" maxlength="32" name="changePasswordnew1" type="password" class="validate">'; content += '<label for="changePasswordnew1">Ulangi Password</label></div>'; content += '</div>'; content += '</form>'; content += '</div>'; content += '<div class="modal-footer">'; content += '<a href="#" onClick="check_ganpass()" id="btn_ok" class="modal-action modal-close waves-effect waves-green btn-flat ">Edit</a>'; content += '<a href="#!" onClick="cancelchangePassword()" class="modal-action modal-close waves-effect waves-red btn-flat ">Cancel</a>'; content += '</div>'; content += '</div>'; content += '</div>'; $("#formodal").append(content); $('#changeUsername').val(user);} //for check function check_ganpass(){ var username = $('#changeUsername').val(); var passwordold = $('#changePasswordold').val(); var passwordnew = $('#changePasswordnew').val(); var passwordnew1 = $('#changePasswordnew1').val(); var urlnyah = 'pas.php'; $.ajax({ url : urlnyah, data : 'username='+username+'&passwordold='+passwordold+'&passwordnew='+passwordnew+'&passwordnew1='+passwordnew1, type : 'POST', dataType: 'html', success : function(pesan){ if(pesan=='ok,'){ Materialize.toast('Data Telah Berubah',4000); } else{ Materialize.toast(pesan,4000); } } });}
pas.php
<?php include("connection.php"); session_start(); $username = $_POST['username']; $passwordold = md5($_POST['passwordold']); $passwordnew = md5($_POST['passwordnew']); $passwordnew1 = md5($_POST['passwordnew1']); $query = mysql_query("select * from tuser where username ='$username' and password = '$passwordold'"); $data = mysql_num_rows($query); if ($data ==1) { if ($passwordnew == $passwordnew1){ mysql_query("UPDATE tuser SET password='$passwordnew1' WHERE username='$username'"); echo "ok,"; } else { echo "Password new not same"; }}else{ echo "Password old werong.";}?>
connection.php
<?php $sambung=mysql_connect('localhost','root', '')or die('Not connected : ' . mysql_error()); mysql_select_db("test", $sambung)or die('Not connected : ' . mysql_error());?>
The question is how to disable closing the modal on click outside of the box and if the entered data is wrong.
Thanks for the correction.