We Keep Coding

Set id for bootbox textarea

Below is code to open bootbox with textarea:
bootbox.prompt({
title: "This is title",
inputType: 'textarea',
placeholder: 'Feedback',
callback: function (result) { console.log(result); }
});
I can see textarea created like below:
<textarea class="bootbox-input bootbox-input-textarea form-control" placeholder="Feedback"></textarea>
I tried to give id like: id: "test_id", but it is giving me an error. Can anyone help please?
I am opening this bootbox on click of one button.

You can add id by jQuery in simple way .
bootbox.confirm({
message: 'message',
buttons: {
'confirm': {
title: "This is title",
inputType: 'textarea',
placeholder: 'Feedback',
label: 'OK',
className:'bootbox-input bootbox-input-textarea form-control'
}
},
callback: function(result) {
if (result) {
console.log("OK clicked");
}
}
});
$(".bootbox-input-textarea").attr('id', 'bootbox-confirm-id');
<textarea class="bootbox-input bootbox-input-textarea form-control" placeholder="Feedback"></textarea>
For more information , visit the LINK

function openBootbox () {
bootbox.prompt({
title: "This is title",
inputType: 'textarea',
placeholder: 'Feedback',
callback: function (result) { console.log(result); }
});
}
Hit this openBootbox function on any button click

Confirmation box in jqgrid

Can we make confirmation box same as delete in jqgrid for doing any other operation in jqgrid. What changes we need to do in classes or html so that the look and feel should be the same as delete confirmation box.

You can use the method $.jgrid.info_dialog. The code could be the following
$.jgrid.info_dialog.call($grid[0],
"Confirmation", // dialog title
"Are <b>you</b> sure?", // any HTML code of the content of the dialog
"",
{
buttons: [
{
id: "my_yes",
text: "Yes",
onClick: function (e, $dlg) {
alert("Yes is clicked");
}
},
{
id: "my_no",
text: "No",
onClick: function (e, $dlg) {
alert("No is clicked");
}
}
]
});
where $grid is a variable initialized like var $grid = $("#youGridId");. The resulting dialog looks like on the picture below:

How do i edit a Javascript / Bootbox/ Bootstrap confirm window?

I have a simple bootbox / javascript confirm window at:
https://www.guard-gate.com/test2/index.html
How do I make the Success button link to google, the Danger button link to yahoo.com and the Click Me button close the box?
How do I change the position of the window to get it in the middle of the page?

You could try something like this for setting the modal in the middle:
var windowHeightCalc = $(window).height() / 2,
modalHeightCalc = $('.modal-content').height();
$('.modal').css({ 'margin-top': [windowHeightCalc - modalHeightCalc, 'px'].join('') });
You don't really need Bootbox for making the modal just use the default Bootstrap modal - http://getbootstrap.com/javascript/#modals
You can modify it and change the links as you wish. To open it simply run:
$('#myModal').modal('show');
and to hide it:
$('#myModal').modal('hide');

In Bootbox you could try using that what the documentation advise you:
bootbox.dialog({
message: "I am a custom dialog",
title: "Custom title",
buttons: {
success: {
label: "Success!",
className: "btn-success",
callback: function() {
Example.show("great success");
}
},
danger: {
label: "Danger!",
className: "btn-danger",
callback: function() {
Example.show("uh oh, look out!");
}
},
main: {
label: "Click ME!",
className: "btn-primary",
callback: function() {
Example.show("Primary button");
}
}
}
});
In the callbacks you could do everything. For JS-redirects you can do:
window.location.href = "http://whatever.com";

noty, call a function on button click

This is a prototype function I use for displaying confirmation with buttons using noty.
function confirmation(message, call_func)
{
var m=noty(
{
text: message,
modal: true,
layout : 'center',
theme: 'notifications',
buttons: [
{
addClass: 'general-button red', text: 'Yes', onClick: function($noty)
{
call_func;
$noty.close();
}
},
{
addClass: 'general-button', text: 'No', onClick: function($noty)
{
$noty.close();
}
}]
});
return m;
}
I am calling this function with the syntax,
confirmation("Are you sure want to delete this item?", "delete("+id+")");
So on clicking the Yes button, another function delete(id) have to be called. But it does not, why?
I checked with alert, alert(call_func). I alerts as delete(10) where 10 is ID at the instance.

Well here you are not calling the function
call_func;
you are just referencing it
And here you are just building a string
"delete("+id+")")
it is not a reference to a function call.
What you need to do is pass in an actual function and execute the function.
confirmation("Are you sure want to delete this item?", function(){ delete(id); });
and
call_func();

record being deleted without confirmation?

I am using bootbox dialogs for confirming before deleting records.
here is my jQuery script for confirmation before deleting record.
<a class="btn btn-xs btn-danger" id="deleteContent" title="Delete">delete</a>
$('#deletec').click(function (e) {
bootbox.dialog({
message: "you data is save",
title: "Custom title",
buttons: {
success: {
label: "Success!",
className: "btn-success",
callback: function () {
Example.show("great you save it");
}
},
danger: {
label: "Danger!",
className: "btn-danger",
callback: function () {
Example.show("record deleted!");
}
}
}
});
});
it is showing correct dialog but the record being deleted without taking confirmation, can anyone please tell me how can i prevent deletion of record without confirmation ? Thanks in advance.

You can not do what you want because the modal dialog that you are using has no way of pausing the click action. You would need to have to cancel the click action and than make that call.
One way is just to unbind click and call it again
$('#deleteContent').on("click", function (e) {
e.preventDefault();
bootbox.dialog({
message: "you data is save",
title: "Custom title",
buttons: {
success: {
label: "Success!",
className: "btn-success",
callback: function () {
Example.show("great you save it");
}
},
danger: {
label: "Danger!",
className: "btn-danger",
callback: function () {
Example.show("record deleted!");
$('#deleteContent').off("click")[0].click();
}
}
}
});
});
As I said in my comments above, making a delete request with a get is a BAD idea. If a user has a plugin that prefetches pages, say goodbye to all your data in the database.
What happens in the code
e.preventDefault(); Cancels the click event so it will not go to the server
$('#deleteContent').off("click") //removes the click event so it will not be called again
[0].click() //selects the DOM element and calls the click event to trigger the navigation