I'm currenty using Wkhtmltopdf to export Full Calendar to PDF.
My Html code is (only Body) :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Fine & Country</title>
<link href="https://fonts.googleapis.com/css?family=Fenix:400" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Dosis:400,600" rel="stylesheet">
<link href="http://localhost:21792/Content/select2.min.css" rel="stylesheet" />
<link href="http://localhost:21792/Content/fullcalendar_year.css" rel="stylesheet" />
<link href="http://localhost:21792/Content/jquery-ui.css" rel="stylesheet" />
<link href="http://localhost:21792/Content/select2.min.css" rel="stylesheet" />
<style>
.fc-left, .fc-right
{
display: none;
}
</style>
</head>
<body>
<div id="calendar-full"></div>
<script src="http://localhost:21792/Scripts/jquery-1.10.2.js"></script>
<script src="http://localhost:21792/Scripts/moment.min.js"></script>
<script src="http://localhost:21792/Scripts/fullcalendar_year.js"></script>
<script src="http://localhost:21792/Scripts/Custom/pt.js"></script>
<script src="http://localhost:21792/Scripts/jquery-ui.min.js"></script>
<script src="http://localhost:21792/Scripts/Custom/HollidayPdf.js"></script>
<script type="text/javascript">
while (window.status != "READY");
</script>
</body>
</html>
I guarantee that json calls finish before load the page.
My Javascript code is (File: HollidayPdf.js):
var fullCalendarApproval;
var events, notWorkingDays;
var date = new Date();
var isLoadedNotWorkingDays = false, isLoadedEvents = false;
jQuery.ajax({
url: 'http://localhost:21792/Hollidays/LoadNotWorkingDays',
type: 'GET',
dataType: "json",
contentType: "application/javascript",
async: false,
cache: false,
success: function (data) {
isLoadedNotWorkingDays = true;
notWorkingDays = data;
}
});
jQuery.ajax({
url: 'http://localhost:21792/Hollidays/ListAllHolidaysSchedulled',
type: 'GET',
dataType: "json",
contentType: "application/javascript",
async: false,
cache: false,
success: function (data) {
isLoadedEvents = true;
events = data;
}
});
while (!isLoadedNotWorkingDays && !isLoadedEvents);
var d = date.getDate();
var m = date.getMonth();
var y = date.getFullYear();
if (jQuery('#calendar-full').length > 0) {
jQuery('#calendar-full').fullCalendar({
defaultView: 'year',
header: {
left: 'prev,next today',
center: 'title',
right: 'year,month'
},
yearColumns: 2,
firstDay: 1,
editable: false,
events: events,
loading: function (bool) {
},
viewRender: function (view, element) {
jQuery.each(notWorkingDays, function (i) {
jQuery('.fc-day[data-date="' + notWorkingDays[i]["date"] + '"]').css('background', "#e2dec1");
});
}
});
}
window.status = "READY";
But every time i execute wkhtmltopdf with the following line i get only Weeks.
My command line is :
wkhtmltopdf.exe --window-status READY D:\Projects\CRM\FineCountry.html D:\Projects\CRM\test1.pdf
For what i've seen only transform part of the calendar, it's weird.
Does anyone faced similar Issue???
Related
here is my code below it's in the View Layer I am struggling to change change the color of my column headings to orange. please help.
#model IEnumerable<uYilo_FMS.Models.vehicle_obj>
#using GridMvc.Html
#{
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="with=device-width"/>
<link href="#Url.Content("~/Content/Gridmvc.css")" rel="stylesheet" />
<script src="#Url.Content("~/Scripts/jquery-1.10.2.min.js")"></script>
<script src="#Url.Content("~/Scripts/gridmvc.min.js")"></script>
<rowDefinition Height="57" width="873">
<title>#ViewBag.Title = "Title"</title>
</head>
<body>
<h3>Vehicles List</h3>
<div class="page-wrap">
#Html.Grid(Model, GridRenderOptions.Create("VehiclesGrid")).Columns(columns =>
{
columns.Add().Encoded(false).Sanitized(false).RenderValueAs(c => #<img class="thumbnail" src="~/Content/images/#c.ImagePath" height="80" width="80" alt="#c.ImagePath" />);
columns.Add(c => c.displayName).Titled("Vehicle Name");
columns.Add(c => c.make).Titled("Make");
columns.Add(c => c.type).Titled("Type");
columns.Add(c => c.odometer).Titled("Odometer");
}).WithPaging(5).Sortable(true).
</div>
<script>
function getRow(vehicle_reg) {
$.jax({
url: '#Url.Action("DisplayTripHistory", "Home")',
data: JSON.stringify(vehicle_reg),
contentType: 'application/json',
dataType: 'json',
type: 'POST',
success: function () {
alert('SUCCESS');
},
error: function () {
alert('error');
}
}
);
}
</script>
After render grid you will see header of grid use
.grid-header
class,
so you can create CSS to make it change
Example:
.grid-header a{
color:red; }
You will see text header color will be Red
To know more checkout this link http://www.codeproject.com/Tips/597253/Using-the-Grid-MVC-in-ASP-NET-MVC
Hope it helps!
On Page 1 I get the object I need:
ProjectSearchCriteria = (GBLProjectSearchCriteria)Session[GblConstants.SESSION_PROJECT_SEARCH_CRITERIA];
I'm trying to pass this to an API on a page load of Page 2.
Page 2:
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<link href="../x.css" type="text/css" rel="stylesheet">
<link href="../Content/kendo.common.min.css" rel="stylesheet" />
<link href="../Content/kendo.default.min.css" rel="stylesheet" />
</head>
<body>
<form id="frmProjectSearchResults" runat="server">
</form>
<script src="../Scripts/ProjectsTreeView.js"> </script>
<script type="text/javascript">
CreateProjectTree(<%= ProjectSearchCriteria %>);
</script>
</body>
</html>
And this is the JavaScript function:
function CreateProjectTree(searchCriteria)
{
debugger;
var projects = new kendo.data.HierarchicalDataSource({
transport: {
read: {
url: "../api/projects?searchcriteria =" + searchCriteria,
contentType: "application/json"
},
parameterMap: function (data, operation) {
return JSON.stringify(data);
}
},
schema: {
model: {
children: "seasons"
}
}
});
$("#treeview").kendoTreeView({
dataSource: projects,
loadOnDemand: true,
dataUrlField: "LinksTo",
checkboxes: {
checkChildren: true
},
dataTextField: ["Title"],
select: treeviewSelect
});
function treeviewSelect(e) {
var node = this.dataItem(e.node);
window.open(node.NotificationLink, "_self");
}
}
Can anyone help me understand what I'm doing wrong?
Maybe this:
<script type="text/javascript">
CreateProjectTree("\"" + <%= ProjectSearchCriteria %> + "\"");
</script>
How to send xml parameter to call WCF method? My client side code is in AJAX,JSON using jQuery.I want to pass xml value as parameter.How to pass xml value?
My xml value is
<value><Root>mydata</Root></value>
My client side code--
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.min.js"></script>
<script type="text/javascript" >
jQuery.support.cors = true;
var bhRequest = "<s:Envelope xmlns:s=\"http://schemas.xmlsoap.org/soap/envelope/\">" +
"<s:Body>" +
"<GetSMC xmlns=\"http://tempuri.org/\">" +
"<value><Root>MyValue</Root></value>" +
"</GetSMC>" +
"</s:Body>" +
"</s:Envelope>";
$(document).ready(function () {
$("#btnWCFBasicHttp").click(function () {
alert("hi");
$.ajax({
type: "POST",
url: "http://localhost:8130/MyService.svc/bh/",
data: bhRequest,
timeout: 10000,
contentType: "text/xml",
dataType: "xml",
beforeSend: function (xhr) {
xhr.setRequestHeader("SOAPAction", "http://tempuri.org/IMyService/GetSMC");
},
success: function (data) {
alert("success");
$(data).find("GetSMCResponse").each(function () {
document.getElementById('Label2').innerHTML = $(this).find("GetSMCResult").text();
});
},
error: function (xhr, status, error) {
alert(error);
}
});
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input id="btnWCFREST" type="button" value="Call WCF using JQuery" />
<label ID="Label1" runat="server" Text="Label"></label>
</div>
</form>
</body>
</html>
I'm not sure if it'll work, but try to put that XML inside
<![CDATA[ and ]]>
There is also some hack with string tag, but I don't know if it is necessary (maybe only CDATA tag will be enough):
WCF RESTFul service - Pass XML as string to service
you will encrypt by base64 and pass it,on the server client you can decrypt
I am using Jquery auto complete text box , in that i am entering a name starts with z or something which is not available in the database, at that time I need to display a custom message in auto complete mentioning that "No Datas Found"
I came up with a solution,please Correct me if the below mentioned solution is incorrect or any other alternate way to achieve it.
Thanks in advance.
AutoComplete TextBox.aspx
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="AutoCompleteTextBox.aspx.cs" Inherits="Ajax_Using_Jquery.AutoCompleteTextBox" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Ajax Auto Complete Using Jquery</title>
<script type="text/javascript" src="JQuery/jquery-1.9.0.mini.js"></script>
<script type="text/javascript" src="JQuery/jquery-ui.min.js" ></script>
<%--<link type="text/css" href="StyleSheet/jquery-ui.css" rel="Stylesheet" />--%>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<%--<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> --%>
<script type="text/javascript">
$(document).ready(function () {
$(".autosuggest").autocomplete({
source: function (request, response) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: "AutoCompleteFetchService.asmx/getUserNames",
data: "{'TextBoxVal':'" + document.getElementById('txtName1').value + "'}",
dataType: "json",
success: function (data) {
response(data.d);
if (data.d == "" || data.d == null || typeof (data.d) == 'undefined') {
response(["no search found"]);
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("error " + XMLHttpRequest);
alert("error " + textStatus);
alert("error " + errorThrown);
}
});
}
});
});
</script>
<%-- <link href="StyleSheet/jquery-ui.css" type="text/css" rel="Stylesheet" />--%>
</head>
<body>
<form id="form1" runat="server">
<table>
<tr>
<td>
<div>
User Name :
<input type="text" id="txtName1" class="autosuggest" />
</div>
</td>
</tr>
</table>
</form>
</body>
</html>
AutoCompleteFetchService.asmx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Data.SqlClient;
using System.Configuration;
namespace Ajax_Using_Jquery
{
/// <summary>
/// Summary description for AutoCompleteFetchService
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
[System.Web.Script.Services.ScriptService()]
// To allow this Web Service to be called from script, using ASP.NET AJAX, uncomment the following line.
// [System.Web.Script.Services.ScriptService]
public class AutoCompleteFetchService : System.Web.Services.WebService
{
[WebMethod]
public List<string> getUserNames(string TextBoxVal)
{
string strCon;
List<string> objList = new List<string>();
strCon = ConfigurationManager.ConnectionStrings["EmpNameFetch"].ConnectionString;
SqlConnection con = new SqlConnection(strCon);
SqlCommand cmd = new SqlCommand(#"select EmpName from newTb2 where EmpName like '%" + TextBoxVal + "%'", con);
con.Open();
SqlDataReader objReader = cmd.ExecuteReader();
while (objReader.Read())
{
objList.Add(objReader["EmpName"].ToString());
}
con.Close();
return objList;
}
}
}
The following prints "0 results" if no results are found and, if results are found, prints a helpful message to the user that says "Click or Arrow Up/Down"
messages: {noResults: '0 Results',results: function() {return 'Click or Arrow U/D'; } }
I'm trying to write some JQuery using the AutoComplete plugin to display a list of names to the user as the user starts to type in the names (see code below). The code is working fine unless the user starts backspacing to change the name of the user entered, which causes it to write new values over the existing ones in the autocomplete results. Is there something I'm doing wrong here, maybe by using the keyup function to kick off the autocomplete, or is there some way to clear the existing autocomplete results if the user starts to backup?
Here is the JQuery code in the markup file in Default.aspx:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="js/jquery-1.3.2.js" ></script>
<script type="text/javascript" src="js/jquery.autocomplete.js" ></script>
<script type="text/javascript">
$(document).ready(function() {
$("#example").keyup(function() {
$.ajax({
type: "POST",
url: "Default.aspx/GetCustomerNames",
data: "{ searchParam: '" + $("#example").val() + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
$("#example").autocomplete(msg.d,
{ scroll: false, max: 10, width: 250, selectFirst: true });
}
});
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
Customer Name: <input id="example" autocomplete="off" type="text" />
</div>
</form>
</body>
</html>
And here is the code in my Default.aspx.cs codebehind file returning the data:
[WebMethod]
public static string[] GetCustomerNames(string searchParam)
{
List<string> data = new List<string>() { "Andrew", "Ramona", "Russ", "Russell", "Raymond", "Annette", "Anthony" };
List<string> names = new List<string>();
foreach (string s in data)
{
if (s.ToLower().StartsWith(searchParam))
{
names.Add(s);
}
}
return names.ToArray();
}
I was under the impression that you could give a search page as the first parameter to the autocomplete function.
$(document).ready(function(){
$("#example").autocomplete("Default.aspx/GetCustomerNames", { scroll: false, max: 10, width: 250, selectFirst: true });
});
Something like that, you may need to find out the correct options to use to get it to do what you want, but at least it won't be reinstalling the autocomplete after each keyup.