|
Hi,
I need help on consuming external WCF REST service and display the data using angular.js.
I have (url:http://localhost/service1.svc/flowers) that fetches WCF REST service which returns data in JSON format as given below:
[{"FlowerName":"Jasmine","Place":"Mysore"},{"FlowerName":"Rose","Place":"Bangalore"},{"FlowerName":"Sun flower","Place":"Belgaum"}]
I need to display the above data in a html with rows and columns respectively.
Can anyone please help me with suitable sample code?
Kind regards,
Ram
|
|
|
|
|
You can try to use a View template, it will fit your needs, I'm using one right now (doT.js).
It will take you some time to understand it, but after that, displaying your objects will be a game  !
|
|
|
|
|
i know how to do it jquery
$.ajax({
type: "GET",
url: "http://localhost/service1.svc/flowers",
success:function(data){
var x=JSON.parse(data);
var builtHtml="<tr><td>FlowerName</td><td>Place</td></tr>";
for(i=0;i<x.length;i++)
{builtHtml+="<tr><td>"+x[i].FlowerName+"</td><td>"+x[i].Place+"</td></tr>"}
$("#tableID").append(builtHtml)
}})
But i never used angular.js before 
modified 7-Mar-14 16:41pm.
|
|
|
|
|
I have been trying to get the method to work. I have seen and tried quite a few online examples including the example found on W3C (which is below). Even on their site, it doesn't work. I have tried to get the method to work by:
Refresh the page, using back and forward buttons, and closing the window. Nothing happens in IE, Firefox or Chrome. I am at a loss as to why this doesn't work.
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
alert("Thank you for visiting W3Schools!");
}
</script>
</head>
<body onunload="myFunction()">
<h1>Welcome to my Home Page</h1>
<p>Close this window or press F5 to reload the page.</p>
</body>
</html>
|
|
|
|
|
I pasted your code as is into a file and it runs as it should. Perhaps you have a typing error in your actual code?
vbmike
|
|
|
|
|
BODY object in Internet Explorer, see
http://msdn.microsoft.com/en-us/library/ms535205%28v=vs.85%29.aspx
|
|
|
|
|
I need to check whether the radio button is selected or not. So, when I click on submit button, it will check the radio button, if there's unselected button then show alert, if button is selected then move to another page. Can anyone help me using Javascript??? Thank you
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
</head>
<body>
<form id="form" name="form" action="" method="post">
<style type="text/css">
.tftable {font-size:16px;color:#333333;width:50%;border-width: 1px;border-color: #729ea5;border-collapse: collapse;}
.tftable th {font-size:24px;background-color:#acc8cc;border-width: 1px;padding: 8px;border-style: solid;border-color: #729ea5;text-align:left;}
.tftable tr {background-color:#d4e3e5;}
.tftable td {font-size:16px;border-width: 1px;padding: 8px;border-style: solid;border-color: #729ea5;}
.tftable tr:hover {background-color:#ffffff;}
</style>
<table class="tftable" border="1">
<tr><th width="400"><div align="center" class="style2">Questions</div></th><th colspan="2"><div align="center" class="style2">Answer</div></th>
</tr>
<tr><td>I like to listen to songs on the radio or a CD</td>
<td width="70">
<label></label>
<label>
<input name="bm1" type="radio" value="1" />
Yes</label>
</td>
<td width="72">
<label></label>
<label>
<input name="bm1" type="radio" value="2" />
No
</label>
</td>
</tr>
<tr><td>I like to watch music videos on TV</td><td>
<label>
<input name="bm2" type="radio" value="1" />
Yes</label>
</td>
<td>
<label>
<input name="bm2" type="radio" value="2" />
No </label>
</td>
</tr>
<tr><td>I like to go to music concerts and hear live music</td><td>
<label>
<input name="bm3" type="radio" value="1" />
Yes</label>
</td>
<td>
<label>
<input name="bm3" type="radio" value="2" />
No </label>
</td>
</tr>
<tr><td>I can easily remeber tunes, raps, or melodies</td><td>
<label>
<input name="bm4" type="radio" value="1" />
Yes</label>
</td>
<td>
<label>
<input name="bm4" type="radio" value="2" />
No </label>
</td>
</tr>
<tr><td>I take music lessons, singing lessons, or play a muscial instrument</td><td>
<label>
<input name="bm5" type="radio" value="1" />
Yes</label>
</td>
<td>
<label>
<input name="bm5" type="radio" value="2" />
No </label>
</td>
</tr>
<tr><td>I can learn new songs easily</td><td>
<label>
<input name="bm6" type="radio" value="1" />
Yes</label>
</td>
<td>
<label>
<input name="bm6" type="radio" value="2" />
No </label>
</td>
<tr><td>I like to sing</td><td>
<label>
<input name="bm7" type="radio" value="1" />
Yes</label>
</td>
<td>
<label>
<input name="bm7" type="radio" value="2" />
No </label>
</td>
</tr>
</table>
</form>
</body>
</html>
modified 7-Mar-14 5:35am.
|
|
|
|
|
First, add a javascript code in the header to validate that all radios are checked, if all checked, proceed to submit else cancel the submit. Next you have to add a submit button in the form, last, modify the form tag to add an onsubmit event to call the validation javascript code. See example:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
function validateRadio()
{
var inputs = myform.elements;
var radios = [];
for (var i = 0; i < inputs.length; ++i) {
if (inputs[i].type == 'radio') {
radios.push(inputs[i]);
}
}
var countChecked = 0;
for (var j = 0; j < radios.length; j++) {
if (radios[j].checked) {
countChecked++;
}
}
if (countChecked != radios.length / 2){
alert("All questions must be answered.");
return false;
} else {
return true;
}
}
</script>
</head>
</head>
<body>
<form name="myform" method="post"
onSubmit="return validateRadio()" action="anotherfile.php">
<!-- your other code --->
</table>
<input type="submit" name="submit" id="submit" value="Submit">
</form>
</body>
</html>
|
|
|
|
|
Thanks Peter Leow...
It's works for me!!!
GBU...
|
|
|
|
|
I add another code for counting button with value=1
I keep getting the result = 0
Can you tell me what do i miss?
Here's the code
for (var i = 0; i < inputs.length; ++i) {
if (inputs[i].type == 'radio') {
radios.push(inputs[i]);
}
}
var countChecked = 0;
for (var j = 0; j < radios.length; j++) {
if (radios[j].checked) {
countChecked++;
}
var answeramount = 0;
if(radios[j].checked && radios[j].value==1){
answeramount++;
}
}
I get it fix by making new loop. But i still confused why the first code didn't work...
Here's the new code
var countChecked = 0;
for (var j = 0; j < radios.length; j++) {
if (radios[j].checked) {
countChecked++;
}
}
var answeramount = 0;
for (var k = 0; k < radios.length; k++){
if(radios[k].checked && radios[k].value==1){
answeramount++;
}
}
|
|
|
|
|
That is because you have placed this line of code inside the for loop which keep resetting it to zero.
var answeramount = 0;
If your problem has been answered then edit your message and add [Solved] to the subject line of your original post, and cast an approval vote to the one or several answers that really helped you." Thanks.
|
|
|
|
|
Hi,
I know that objects in javascript, like in many other languages, holds the reference to the object itself and primitive types like number bool holds the actual value.
I have something like this:
function manager()
{
var anObject = {prop1: 1, prop2: 2};
.
.
.
return
{
getMyObject: function(){
return anObject;
}
}
My question is why when I do something like this:
var m = new manager();
var o = m.getMyObject();
o = {a: 10, b: 20};
The actual value in 'o' which is a reference type is not changed when I do this:
var o2 = m.getMyObject();
what is actually set in the variable 'o'?
and how can I make it persist in the above
|
|
|
|
|
Your code currently does the following:
- Store the object returned from
getMyObject in a variable called o; - Store a new object in the
o variable; - Store the object returned from
getMyObject in a variable called o2;
It should be fairly obvious why o and o2 do not point to the same object - step 2 makes o point to a new, different object.
If you want your changes to the object to be persisted for future calls of the getMyObject function, you need to change the properties of the object returned from that function:
var m = new manager();
var o = m.getMyObject();
o.prop1 = 10;
o.prop2 = 20;
var o2 = m.getMyObject();
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Thanks for your reply Richard,
I understood the sequence but there's still something not clear for me.
A variable which holds a reference, basically holds a pointer to an object.
If I set variable 'a' which holds a reference to object1 to a new variable called 'b', both of them
will have a pointer that should point to the same place i.e. object1.
Maybe I'm confusing it with a language like c# but if I set a new object to variable 'a' called 'object2',
I'm creating a new pointer to that new object. I expect the place in memory where the original pointer which pointed to 'object1' will change and point to object2 for both 'a' and 'b'.
But I see that's not happening.
'a' points to the new object while 'b' still points to the older one.
|
|
|
|
|
No. If variables a and b point to object1, and you change variable a to point to object2, variable b will not be affected.
If you're more comfortable with C#, consider the following contrived example:
string a = string.Empty;
string b = string.Empty;
a = "Hello";
What value do you think will be in b after you run this code?
If the language followed your idea, since both variables start out pointing to the same string, when you change a to point to the string "Hello", it would automatically change b as well. That would make it virtually impossible to write a program, since all variables and fields of the same type would automatically be pointing to the same instance of that type.
Think of it like postal addresses: person a lives at address1, and person b also lives at address1. If you change the street-name for address1, that change affects both people. If person a moves to address2, that doesn't necessarily mean that person b moves as well.
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Great, that was a good explanation.
Thanks Richard!
|
|
|
|
|
constructor of "ype "m" is function manager(){...}
m = new constructor (...)
m is a pointer !
e.g. new Function(...) creates a pointer of a function
new Function() is a member of Javascript predefines types (predefined constructor)
so manager() runs like new Function() ?
function manager()
{
var anObject = {prop1: 1, prop2: 2};
// local var !!!!
// does not exists after the end of constructor
// use global var !
.
.
.
return
{
getMyObject: function(){
return anObject;
}
// local function !!!!
// does not exists after the end of constructor
// use global var to save the pointer.
}
|
|
|
|
|
Hi All
I need to emulate bandwidth throttling scenario on my web application, I have two buttons, when user click on first button then play a video from my server, this should be poor user experience (through bandwidth throttling on this session between my laptop and my web server)
On the other hand when user clicks a second button, and then play same video(HTML5 video), then better quality of experience should be observed,
Is there a way I can achieve this using java-script?
|
|
|
|
|
readystatechange event ist useable for AUDIO, see
http://msdn.microsoft.com/en-us/library/hh772923%28v=vs.85%29.aspx
javascript runs only on client, sou you must use interface to catch state of an element
its events like readystatechange-event
|
|
|
|
|
Hi
I have worked in front end but in the company I worked we don't do any cross browser compatibility.
How we can do the cross browser compatibility.
What are the steps? it is a interview question
Can anybody help with it.
Thanks,
Mary Abraham
|
|
|
|
|
|
Thanks Peter I got an Idea.
Mary Abraham
|
|
|
|
|
If you need to access to a server that don't support CROS and that your data is not sensitive (public data like weather, music info or anything) you can try this :
CROSProxy[^] you'll not have to change your source code also !
|
|
|
|
|
Create a super class ComputingMachine. This class should be designed as parent class of any kinds of computing devices like calculators, timers, mobile phones, etc. Computing machines’ basic attributes includes its manufacturer’s name, product code and classification. You may wish to add more attributes. Along with all the basic methods (constructor, accessor, mutator, output, comparison, and other helper methods), define a method compute() which has nothing to do yet. This method will be overridden in future subclasses.
Extend the ComputingMachine class to two subclasses, Calculator and Timer. Add the necessary attributes and methods for them. These subclasses must implement the BasicOp interface which you must create. The BasicOp interface will require the implementation of methods plus(), minus(), times(), and divideby(). If any one of these methods are not applicable to the class which implements it, the class must be able to handle it.
In the demo class, calculator object must be able to continuously perform the BasicOp methods for two operands until the method compute is invoked, behaving like a simple calculator of the real world.
Timer object in its own demo class, must perform as a countdown timer or a usual lapse timer depending on the users choice.
roni
|
|
|
|
|
Don't repost questions[^], In Q/A section some people made comments to your question. Read that again.
thatrajaCode converters | Education Needed
No thanks, I am all stocked up. - Luc Pattyn
When you're wrestling a gorilla, you don't stop when you're tired, you stop when the gorilla is - Henry Minute
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
