javascript - Bootstrap 3 : add confirm modal box for jQuery Inline delete row -



javascript - Bootstrap 3 : add confirm modal box for jQuery Inline delete row -

i have jquery function delete row info mysql. worked jquery confirm, need add together bootstrap 3 modal box confirm.

js:

function deletebox(id){ if (confirm("are sure want delete record?")) { var datastring = 'id='+ id; $("#flash_"+id).show(); $("#flash_"+id).fadein(400).html('<img src="image/loading.gif" /> '); $.ajax({ type: "post", url: "delete.php", data: datastring, cache: false, success: function(result){ if(result){ $("#flash_"+id).hide(); // if info delete if(result=='success'){ //check random no, animated type of effect var randnum=math.floor((math.random()*100)+1); if(randnum % 2==0){ // delete slide effect $("#list_"+id).slideup(1000); }else{ // hide info $("#list_"+id).hide(500); } }else{ var errormessage=result.substring(position+2); alert(errormessage); } } } }); } }

html:

<a href="javascript:void()"><img alt="delete" title="delete" width="20" src="image/delete.jpg" onclick=deletebox("1") border="0"></a>

how can add together bootstrap 3 confirm modal box function?!

obviously should implement modal box in html code. modal should have 2 buttons (ok , cancel) unique id attributes (probably within of modal-footer div)

# modal code around... <div class="modal-footer"> <button type="button" class="btn btn-danger" id="btndeleteyes" href="#">yes</button> <button type="button" class="btn btn-default" data-dismiss="modal">no</button> </div> # ...

clicking on btndeleteyes should trigger inner logics:

$('#btndeleteyes').click(function () { var datastring = 'id='+ id; $("#flash_"+id).show(); $("#flash_"+id).fadein(400).html('<img src="image/loading.gif" /> '); # here goes logics ajax query , on # ... # may want hide modal box @ point });

instead of implementing scratch seek bootbox.js uses bootstrap modals create dialog boxes. release necessity of writing modals html code , implementing callbacks hands.

here code like:

bootbox.dialog({ message: "are sure want delete record?", title: "confirm choice", buttons: { confirmation: { label: "yes, delete it", classname: "btn-success", callback: function() { var datastring = 'id='+ id; $("#flash_"+id).show(); $("#flash_"+id).fadein(400).html('<img src="image/loading.gif" /> '); # here goes logics ajax query , on # ... } }, refuse: { label: "no, leave alive", }, } });

javascript jquery twitter-bootstrap bootstrap-modal

Comments

Popular posts from this blog

php - Android app custom user registration and login with cookie using facebook sdk -

django - Access session in user model .save() -

php - .htaccess Multiple Rewrite Rules / Prioritizing -