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
Related
This question already has an answer here:
How to refer http handler file from jQuery ajax under different directory of asp.net web application
(1 answer)
Closed 5 years ago.
I created a http handler file in following directory of my application
I am referring this handler from common.js file using jQuery ajax and common.js file referred in aspx pages StoresSummary.aspx & EmoloyeeProfile.aspx
From EmoloyeeProfile.aspx I am able to call the handler and getting the output, but from StoresSummary.aspx jquery ajax call getting failed.
I know the cause of failure because the path of CommonHandler.ashx file does not map correctly due to location hierarchy of StoresSummary.aspx.
This is a sample code I am posting, the http handler file I need to call from jQuery ajax and aspx pages may exists in different directory of same web application.
How do I give path of CommonHandler.ashx in ajax jQuery call so any location hierarchy of my aspx page can call it.
This is my code
common.js
function GetMessage(key) {
var message = '';
$.ajax({
type: 'POST',
url: '../../Common/Handlers/CommonHandler.ashx', /*Working for EmoloyeeProfile.aspx but not for StoresSummary.aspx*/
contentType: 'application/json; charset=utf-8',
dataType: 'json',
data: { 'MessageKey': key },
success: onSucess,
error: OnFailed,
async: false
});
function onSucess(res) {
message = res;
}
function OnFailed(res) {
alert('failed');
}
return message;
}
CommonHandler.ashx
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Serialization;
namespace DemoWebApp.Common.Handlers
{
/// <summary>
/// Summary description for CommonHandler
/// </summary>
public class CommonHandler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
JavaScriptSerializer javaScriptSerializer = new JavaScriptSerializer();
string result = javaScriptSerializer.Serialize(GetData(context.Request["MessageKey"]));
context.Response.ContentType = "text/html";
context.Response.Write(result);
}
private string GetData(string Id)
{
return DateTime.Now.ToString(); //just to demostrate
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
StoresSummary.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="../../../Common/Scripts/common.js"></script>
<script src="../../../Common/Scripts/jquery-1.9.1.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="Get Message" OnClientClick="return CallMethod();" />
</div>
</form>
<script type="text/javascript">
function CallMethod() {
var msg = GetMessage('001');
alert(msg);
return false;
}
</script>
</body>
</html>
EmoloyeeProfile.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="../Common/Scripts/common.js"></script>
<script src="../Common/Scripts/jquery-1.9.1.min.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="Get Message" OnClientClick="return CallMethod();" />
</div>
</form>
<script type="text/javascript">
function CallMethod() {
var msg = GetMessage('001');
alert(msg);
return false;
}
</script>
</body>
</html>
Provide absolute path to the handler. You are providing relative path now. See the ajax url section.
$.ajax({
type: 'POST',
url: '/Common/Handlers/CommonHandler.ashx', /*Working for EmoloyeeProfile.aspx but not for StoresSummary.aspx*/
contentType: 'application/json; charset=utf-8',
dataType: 'json',
data: { 'MessageKey': key },
success: onSucess,
error: OnFailed,
async: false
});
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???
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>
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.