I have problem in binding data to a control in html page,here we have a web service in remote location as we are binding the data to a control(dropdown) in html the data is not binding the code for fine for localhost but for the remote url.here i'm placing code below can any one tell me any modifications or any code to be added to it.
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="Scripts/jquery-1.8.3.js" type="text/javascript"></script>
</head>
<body>
<select id="CbxArea" style="width: 200px">
<option>Select Area</option>
</select>
<script type="text/javascript">
$(document).ready(function () {
//debugger;
var requestUrl = 'http://192.168.3.252:8081/HaraveerWCF/ExcelDataService.asmx/GetAreaNames';
var ddlArea = $("#CbxArea");
$.ajax({
url: "http://192.168.3.252:8081/HaraveerWCF/ExcelDataService.asmx/GetAreaNames",
//url: "ExcelDataService.asmx/GetAreaNames",
type: "POST",
dataType: "json",
contentType: "application/json; encoding=utf-8",
success: function (data) {
debugger;
for (i = 0; i < data.d.length; i++) {
ddlArea.append($("<option></option>").val(data.d[i].AreaName).html(data.d[i].AreaName));
};
alert(data.d.AreaName);
},
error: function (e) {
$('#status').innerHTML = "Unavailable";
}
});
});
</script>
Thanks in Advance.
Related
I have a div in my HTML like this in which I'd like to set the ID of capital using JQuery
` <div class="modal-body">
<p id="capital"></p>
</div> `
This is how I'm setting it in my JQuery function
`function getWeather() {
$.ajax({
url: "assets/geojson/countryBorders.geo.json",
type: "GET",
dataType: "json",
data: {
},
success: function(result) {
let features = result["features"];
let countryFeature = findFeatureFromName(countryName);
let countryCode = JSON.stringify(countryFeature.properties.iso_a2).replace(/"/g,"")
$.ajax({
url: "assets/php/countryInformation.php",
type: 'POST',
dataType: 'json',
data: {
country: countryCode
},
success: function(result) {
console.log(result);
console.log(JSON.stringify(result));
let capitalCity = (result['data'][0]['capital']);
console.log(capitalCity)
$('#capital').html(capitalCity);`
etc
But capital isn't getting set?
The console.log is returning the expected value, so I know that has set okay.
I've even tried
$('#capital').text(capitalCity);
and plain JavaScript out of curiousity
document.getElementById("capital").innerHTML = capitalCity;
Nothing seems to be working and no errors in the console - what would be wrong?
Your HTML and JSON code is correct Code it correct, may be you are missing something in your jSON file
Here is what I tried and got the Output, if possible please post
ountryBorders.geo.json, so that we get more clarity
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>
<body onload="getWeather()">
<div class="modal-body">
<p id="capital"></p>
</div>
<script>
function getWeather() {
debugger;
let capitalCity = 'hello';
console.log(capitalCity)
$('#capital').html(capitalCity);
}
</script>
</body>
</html>
Trying to invoke two webhooks that I've defined on a runbook in an azure automation account.
I can run the webhook through powershell, and it works, but i'm having trouble getting it to run. Below is the code i'm using
<HTML>
<TITLE>Jumpbox Power</TITLE>
<BODY>
<CENTER>
<SCRIPT>
function startjumpbox() {
var _url = 'https://s5events.azure-automation.net/webhooks?token=asdf;
return $.ajax({
type: 'post',
url: _url
})
};
function startjumpbox() {
var _url = 'https://s5events.azure-automation.net/webhooks?token=fdsa';
return $.ajax({
type: 'post',
url: _url
})
};
</SCRIPT>
Start / Stop jumpbox<br>
<button onclick="startjumpbox()">Start Jumpbox</button>
<button onclick="stopjumpbox()">Stop Jumpbox</button
</CENTER>
</BODY>
</HTML>
The idea is that when the first button is pressed, the 'startjumpbox' function is run, which generates a post request to the webhook URL. same goes for the second button and a post to the second webhook URL.
Would appreciate any advise.
Please use the code below. It works at my side, just reference the jquery lib(You can also download it to local and then reference it):
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
sample code:
<!DOCTYPE html>
<HTML>
<head>
<TITLE>Jumpbox Power</TITLE>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<BODY>
<SCRIPT>
function startjumpbox() {
alert("start call 1")
var _url = 'https://s4events.azure-automation.net/webhooks?token=your_token';
$.ajax({
type: 'POST',
url: _url
});
alert("completed call 1")
}
function startjumpbox2() {
alert("start call 2")
var _url = 'https://s4events.azure-automation.net/webhooks?token=your_token';
$.ajax({
type: 'POST',
url: _url
});
alert("completed call 2")
}
</SCRIPT>
Start / Stop jumpbox<br>
<button onclick="startjumpbox()">Start Jumpbox</button>
<button onclick="startjumpbox2()">Start Jumpbox2</button>
</BODY>
</HTML>
My project have following structure.
The pages is in the html file. and server request is processed on Page_load in the other aspx page.
I created a sample application to show the error.
Here is the HTML file HTMLPage1.html
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
var params = 'pak=' + encodeURIComponent('</br>');
debugger;
var url = 'http://localhost:49735/WebForm1.aspx?' + params;
$.ajax({
type: 'POST',
async: false,
url: url,
success: function (data) {
alert('Hi');
}
});
});
</script>
<meta charset="utf-8" />
Here is the PageLoad function in WebForm1.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
var authorize = Request["pak"];
int i = 0;
}
But Request["pak"] is not accessible. I should need to pass pak as </br>
If you want to call web by POST
You should set the data field
like this
$(document).ready(function () {
//var params = 'pak=' + encodeURIComponent('</br>');
debugger;
var url = 'http://localhost:49735/WebForm1.aspx';
$.ajax({
type: 'POST',
async: false,
data:{
pak : encodeURIComponent('</br>')
},
url: url,
success: function (data) {
alert('Hi');
}
});
});
encodeURIComponent('</br>') will encodeURL like "%3C%2Fbr%3E"
You can try to use HttpUtility.UrlDecode() to Decode
var authorize = HttpUtility.UrlDecode(Request["pak"].toString());
You will get </br>
Code is as follows
var myApp = angular.module("gameModule", []);
myApp.controller("gamecontroller", function ($scope) {
$scope.message = "test";
// websocket connection.
var gameHub = $.connection.socketHub;
$.connection.hub.start().done(function () {
var clientid = $.connection.hub.id;
$(function () {
var user = { signalrsessionid: clientid };
$.ajax({
type: "POST",
data: JSON.stringify(user),
url: "http://localhost:53629/api/game/signalr",
contentType: "application/json"
}).done(function (response) {
alert(response);
$scope.responsemessage = response;
});
});
});
});
and front end code
<!DOCTYPE html>
<html ng-app="gameModule">
<head>
<title>game registration</title>
<meta charset="utf-8" />
<script src="Scripts/jquery-1.10.2.js"></script>
<script src="Scripts/jquery.signalR-2.2.1.js"></script>
<script src="Scripts/angular.js"></script>
<!--Automatisch gegenereerde signalR hub script -->
<script src="signalr/hubs"></script>
<script src="Scripts/rouletteAngular.js"></script>
</head>
<body>
<div ng-controller="gamecontroller">
{{ message }}
{{ responsemessage }}
</div>
So the 'message' is being displayed, the alert box with the response is showing the correct response, but the responsemessage doesnt show any value.
Can anyone tell me what i'm doing wrong.
you must call $scope.$apply(); or $scope.$digest(); after setting $scope.responsemessage = response; because you are using jQuery ajax call, which is outside Angulars context.
EDIT:
here you have nice way to use SignalR in AngularJS:
http://henriquat.re/server-integration/signalr/integrateWithSignalRHubs.html
I have an ajax function that is not run when the ajax script is included in my HTML page like so:
<script type='text/javascript' src='ajax.js'></script>
However, if I place the exact same script in the head portion of the HTML page, then it does run.
Why does this occur, and how can I fix it?
<script type="text/javascript">
$(function() {
$(".a").click(function()
{
$.ajax({
type: "POST",
url: "1.php",
data: dataString,
cache: false,
success: function(html)
{
//stuff
}
});
return false;
});
});
</script>
This might seem trivial but did you remove the <script> tags when using it in an external .js file?
The contents of your ajax.js file should just be:
$(function() {
$(".a").click(function() {
$.ajax({
type: "POST",
url: "1.php",
data: dataString,
cache: false,
success: function(html)
{
//stuff
}
});
return false;
});
});
I have the impression that when you mentioned "exactly", you left the script tags intact in the ajax.js file.
Also if this still doesn't work. try added an alert("hello"); line at the top of ajax.js before everything to see whether it runs at all.
I made a example which worked fine for me. cant see any problems so im guessing its a mistype or something silly.
here is the sample code i used:
HTML:
//double check these paths
<body>
<a class="a" href="#">clicky</a>
</body>
Javascript:
$(function() {
// i noticed you put .a here instead of a, i am assuming you are referring the class
$(".a").click(function()
{
alert("1");
$.ajax({
type: "POST",
url: "1.php",
data: "html",
cache: false,
success: function(data)
{
//stuff
$("body").html(data);
}
});
return false;
});
});
PHP:
echo 'bar';