Im using kendoTooltip to display a grid data. When it hover into data, status only display y/n instead Yes/No. Any idea how make it display Yes/No by using template like column/template
$("#grid").kendoTooltip({
filter: "tbody td",
position: "bottom",
width: 200,
content: function(e){
var dataItem = $("#grid").data("kendoGrid").dataItem(e.target.closest("tr"));
var content = ["Status : " + dataItem.status + "<br/>",
"Outlet Type : " + dataItem.outletType + "<br/>",
"Name : " + dataItem.name + "<br/>",
];
return content;
}
}).data("kendoTooltip");
FULL DEMO IN HERE
Your dataItem is giving you exactly y and n so you can fix it like this:
$("#grid").data("kendoGrid").dataItem(e.target.closest("tr"));
console.log("dataItem",dataItem);
if(dataItem.status ==="y") var fullStatus = "yes";
if(dataItem.status ==="n") var fullStatus = "no";
var content = ["Status : " + fullStatus + "<br/>",
"Outlet Type : " + dataItem.outletType + "<br/>",
"Name : " + dataItem.name + "<br/>",
];
return content;
}
}).data("kendoTooltip");
});
Related
I am new to FullCalendar and would like to know how to filter events. For example. by a date or location of a patient?
And how can I rerender the whole calendar?
The method calendar.render(); rendered/rerendered only just what is necessary as far as I have read in the doc?
Thanks for any help
Edit:
I generate the script in Java with a StringBuilder and fetch the events from the DB with a method.
StringBuilder sb = new StringBuilder();
sb.append("document.addEventListener('DOMContentLoaded', function() {"
+ "var calendarEl = document.getElementById('calendar');"
+ "var calendar = new FullCalendar.Calendar(calendarEl, { ");
sb.append("expandRows: true, ");
sb.append("nowIndicator: true, ");
sb.append("slotMinTime: '06:00', ");
sb.append("slotMaxTime: '21:00', ");
sb.append("customButtons: { "
+ "myCustomButton: { "
+ "text: 'New Request', "
+ "click: function() { "
+ "var url = document.getElementById('createRequestUrlId').value;"
+ "window.open(url,\"_self\");"
+ "}"
+ "}"
+ "},");
sb.append("headerToolbar: { "
+ "left: 'prev,next today myCustomButton', "
+ "center: 'title', "
+ "right: 'timeGridDay,timeGridWeek,dayGridMonth,listMonth'"
+ "}, ");
sb.append("initialDate: \'" + dateFormat(new NSTimestamp()) + "\', ");
sb.append("navLinks: true, ");
// sb.append("businessHours: true, ");
// sb.append("editable: true, ");
sb.append("selectable: true, ");
sb.append("dayMaxEvents: true, ");
sb.append("eventClick: function(arg) {"
+ "var eId = arg.event.id; "
+ "document.getElementById('dialogFieldEventId').value = eId;"
+ "document.getElementById('submitButton').click();"
+ "document.getElementById('eventOpenerId').click();"
+ "}, ");
sb.append("events: [ ");
sb.append(eventList());
sb.append("]"
+ "});");
sb.append("calendar.render();");
sb.append("});");
This method is called once when the page/calendar is loaded and then not again unless I reload the page.
However, I only want to reload the calendar with, for example, the filtered events, which are filtered in a Java method.
But I don't know how to call the script again with my java method. If the method of Fullcalendar 'calendar.render()' is called again only the finished script from the beginning is called.
Which for example looks like this
...
events: [{
id: '4321',
title: 'Name',
color: '#6495ED',
start: '2021-04-11T15:00:00',
end: '2021-04-11T15:30:00'
}, {
id: '1234',
title: 'Name',
color: '#FF7F50',
start: '2021-04-12T15:00:00',
end: '2021-04-12T15:45:00'
}, {
id: '3124',
title: 'Name',
color: '#CB3312',
start: '2021-04-13T15:00:00',
end: '2021-04-13T20:00:00'
...
I don't know why my code is giving error while making the ajax call and not responding or working at all. I ran this on an html file. I took this function - getParameterByName() from another stackoverflow answer.tweet-container tag is down the code below outside this script and an empty division.I tried some jquery also.
<script>
function getParameterByName(name, url) {
if (!url) url = window.location.href;
name = name.replace(/[\[\]]/g, "\\$&");
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
results = regex.exec(url);
if (!results) return null;
if (!results[2]) return '';
return decodeURIComponent(results[2].replace(/\+/g, " "));
}
$(document).ready(function(){
console.log("working");
var query = getParameterByName("q")
// console.log("query");
var tweetList = [];
function parseTweets(){
if (tweetList == 0){
$("#tweet-container").text("No tweets currently found.")
} else {
//tweets are existing, so parse and display them
$.each(parseTweets, function(key, value){
//console.log(key)
// console.log(value.user)
// console.log(value.content)
var tweetKey = value.key;
var tweetUser = value.user;
var tweetContent = value.content;
$("#tweet-container").append(
"<div class=\"media\"><div class=\"media-body\">" + tweetContent + "</br> via " + tweetUser.username + " | " + View + "</div></div><hr/>"
)
})
}
}
$.ajax({
url:"/api/tweet/",
data:{
"q": query
},
method: "GET",
success:function(data){
//console.log(data)
tweetList = data
parseTweets()
},
error:
function(data){
console.log("error")
console.log(data)
}
})
});
</script>
strong text
Fix the quotes to resolve your syntax error:
$("#tweet-container").append("<div class=\"media\"><div class=\"media-body\">" + tweetContent + " </br> via " + tweetUser.username + " | " + "View</div></div><hr/>")
Please help!
I have function that create few windows. I set z-index for every window. But when some window got focus, it`s z-index change! How can i disable this feature? !!!!!
function createwindow(obj,objtype,x,y) {
var jsobj = obj;
v_obj[obj_count] = obj;
obj_count = obj_count + 1;
var wnd = $("#" + obj);
wnd.kendoWindow({
width: "150px",
height: "150px",
minWidth: "30px",
minHeight: "2px",
draggable: true,
dragend: SaveWinAttrs,
dragstart: onDragStart
});
$("#" + obj).parent().find(".k-window-action").css("visibility", "hidden");
if (objtype == 'wh') {
$("#" + obj).parent().find(".k-window-titlebar").css('backgroundColor','#fe2712');
$("#" + obj).closest(".k-widget.k-window").css('height', '100px');
$("#" + obj).closest(".k-widget.k-window").css('width', '100px');
$("#" + obj).closest(".k-widget.k-window").css('z-index', '11000');
}
$('.k-window-titlebar').css('height', '2px');
$("#" + obj).parent().find("k-window-content,.k-content").css("padding", "0");
$("#" + obj).parent().find(".k-header").css('min-height', '2px');
$("#" + obj).parent().find(".k-header").css('height', '2px');
//$("#" + obj).closest(".k-window").css({ top: x, left: y });
}
Solved.
I create windows objects and array
var winArray = [];
var winObject = new Object();
winObject.nr = obj;
winObject.color = $("#" + obj).parent().find(".k-window-titlebar").css("backgroundColor");
winObject.x = $("#" + obj).closest(".k-widget.k-window").css("left");
winObject.y = $("#" + obj).closest(".k-widget.k-window").css("top");
winObject.h = $("#" + obj).closest(".k-widget.k-window").css("height");
winObject.w = $("#" + obj).closest(".k-widget.k-window").css("width");
winObject.z = $("#" + obj).closest(".k-widget.k-window").css("z-index");
winArray.push(winObject);
Than on Drag end event restore z-index saved to object.
function onDragEnd(e) {
if (winArray.length > 0) {
for (var i = 0; i < winArray.length; i++) {
$("#" + winArray[i].nr).closest(".k-widget.k-window").css('z-index', winArray[i].z);
}
}
}
I have the following code to call a ajax POST :
$("a[href=Save]").click(function() {
var thisform = $(this).attr("name");
// Get all the information left in the form
var lname = $('div[name="' + thisform + '"] input[name="lname"]').val();
var fname = $('div[name="' + thisform + '"] input[name="fname"]').val();
var mname = $('div[name="' + thisform + '"] input[name="mname"]').val();
var language = $('div[name="' + thisform + '"] input[name="lang"]').val();
var title = $('div[name="' + thisform + '"] input[name="title"]').val();
var ptype = $('div[name="' + thisform + '"] input[name="ProfileType"]').val();
var vip = $('div[name="' + thisform + '"] input[name="VIP"]').val();
var vreason = $('div[name="' + thisform + '"] input[name="Vreason"]').val();
alert (lname);
//Set the Ajax Request
$.post("..\ajax\profileMod.php", {
'lname':lname,
'fname':fname,
'mname':mname,
'language':language,
'title':title,
'ptype':ptype,
'vip':vip,
'vreason':vreason
};
.done(function(data) {
// php code : echo json_encode(array("name"=>"Called!"));
alert(data.name);
});
// Stop original behavior
return false;
});
I don't know where I went wrong but the code is not working. I'm trying to call a php file using the POST, and showing a message to see if the file got called correctly. All my "var" are getting to right value (I've tested all of them one by one).
I've look at so many post to find the error that my eyes hurt! So I'm asking help!!!
Thank you!
looks like you put a ";" where you should have put a ")"
'vip':vip,
'vreason':vreason
}; <-- problem
.done(function(data) {
// php code : echo json_encode(array("name"=>"Called!"));
alert(data.name);
Should be
'vip':vip,
'vreason':vreason
}) <-- fix
.done(function(data) {
// php code : echo json_encode(array("name"=>"Called!"));
alert(data.name);
i think
I am working with a jquery dynamic flip book. I can add post it notes to either page the even or odd. This code create the notes select which page to add the note to and drags.
function CreatePostIt() {
$("#PostIt").dialog({ modal: true, autoResize: true, height: 500, width: 530,
open: function () {
$("#BookMenu").fadeOut(500);
BookMenuShow = false;
$("#pNotes").addClass("yellow");
$("#pNotes").removeClass("transparent");
$("#pNotes").removeClass("blue");
$("#pNotes").removeClass("green");
$("#note-body").text("");
$("#pNotes").css("font-size", $("#NoteFontSize").val());
color = "yellow";
$("#pNotes").text("");
if (PageIndex == 0) {
$("#rightTn").click();
$("#leftTn").attr("src", "images/blank.gif")
$("#rightTn").attr("src", tnNames[PageIndex]);
} else {
$("#leftTn").width(120);
$("#rightTn").width(120);
$("#leftTn").attr("src", tnNames[PageIndex - 1])
$("#rightTn").attr("src", tnNames[PageIndex]);
$("#leftTn").click();
}
},
buttons: {
"INSERT": function () {
var count = $(".npg" + PageSelected).length;
var Annotation = $("<div style='z-index:250000' class='note npg" + PageSelected + "' index='0'></div>");
var aId = "Page-" + PageSelected + "-Note-" + (count + 1);
AnnoCount = AnnoCount + 1;
$(Annotation).attr("id", "Page-" + PageSelected + "-Note-" + (count + 1));
$(Annotation).css("font-size", $("#NoteFontSize").val());
$(Annotation).css("display", "none");
$(Annotation).append("<img class='noteClose' rel='Page-" + PageSelected + "-Note-" + (count + 1) + "' style='float:right; padding:10px 10px 5px 5px' src='images/close.gif'/>");
$(Annotation).append("<div style='padding:25px 25px 25px 25px;' id='noteText" + (count + 1) + "' class='noteBody'>" + $("#note-body").val() + " </div>")
$(Annotation).addClass("liveNote");
$(Annotation).addClass("npage" + PageSelected);
$(Annotation).addClass(color);
$("#pgDv" + (PageSelected)).prepend(Annotation);
$.cookie("Book-" + bookid + "-Page-" + PageSelected, aId + "||" + $("#note-body").val() + "||" + "0,0,0,0||" + color + "||" + $("#NoteFontSize").val() + "<*>", { expires: 365, path: "/" });
**if (ZoomOn != true) {
if ("#rightPageShadow") {
Annotation.draggable({ cusror: "pointer", containment: 'parent'
});
} else {
Annotation.draggable({ cusror: "pointer", containment: "#leftPageShadow"
});
}
}
else if (ZoomOn = true) {
Annotation.draggable({
create: function () {
$(this).show();
},
cusror: "pointer",
containment: "parent"
});
}
$(Annotation).show();
// $("#PostItNoteInd").show();
$(this).dialog("close");
$("#note-body").text("");**
}
, "CANCEL": function () {
$("#pNotes").text("");
$("#leftTn").attr("rel", -10);
$("#leftTn").css("border", "0px solid red");
$("#rightTn").attr("rel", -10);
$("#rightTn").css("border", "0px solid red");
$(this).dialog("close");
}
}
});
var cw = $("#PostItDialogContent").width();
$("#PostIt").dialog("option", "width", cw + 20);
}
the problem I am have is when the post it note is place on the page on left and top it works. but on the right and bottom it does not. I have tried [x,y, x1, y1] but because each book is different I tried to used the my id tags if you #leftPageShadow with is on div and other is #rightPageShadow
Problem fixed I was losing the cookie id change cookie code.